/*
 * EmpleosCusco — estilos propios de la plataforma.
 * Extiende el template Monoline (style.css) sin modificarlo.
 * Paleta del template: acento #ffaa17, oscuro #1b2032, texto #747474.
 */
:root {
	--qc-accent: #ffaa17;
	--qc-accent-dark: #e8940a;
	--qc-dark: #1b2032;
	--qc-text: #747474;
	--qc-muted: #9aa0ad;
	--qc-border: #eee;
	--qc-soft: #f9fcff;
	--qc-shadow: 0 10px 40px -10px rgba(0, 64, 128, .2);
	--qc-radius: 10px;
}

a { text-decoration: none; }

/* ---------- LOGO DE TEXTO ---------- */
.brand-logo {
	font-family: 'Oswald', sans-serif;
	font-size: 28px;
	font-weight: 600;
	letter-spacing: .5px;
	color: #fff;
	text-transform: uppercase;
}
.brand-logo span { color: var(--qc-accent); }
.sticky-wrapper.is-sticky .site-navbar .site-logo a.brand-logo { color: var(--qc-dark); }
.sticky-wrapper.is-sticky .site-navbar .site-logo a.brand-logo span { color: var(--qc-accent); }
.footer_logo .brand-logo { font-size: 30px; }

/* ---------- NAVBAR ---------- */
.site-navbar .site-navigation .site-menu > li > a { padding: 25px 16px; text-transform: none; }
.site-navbar .site-navigation .site-menu .dropdown a,
.site-mobile-menu .site-nav-wrap a { text-transform: none; }
/* Ítem activo según la página (block body_class) */
.page-home .site-navbar .site-menu > li.nav-home > a,
.page-bienes .site-navbar .site-menu > li.nav-bienes > a,
.page-empleos .site-navbar .site-menu > li.nav-empleos > a { color: var(--qc-accent) !important; }
/* Botón "Ingresar" */
.site-navbar .site-navigation .site-menu > li.nav-cta > a {
	background: var(--qc-accent);
	color: #fff !important;
	border-radius: 30px;
	padding: 8px 22px;
	margin-left: 10px;
	transition: .3s;
}
.site-navbar .site-navigation .site-menu > li.nav-cta > a:hover { background: var(--qc-dark); }
/* Submenús del menú móvil: plegados hasta pulsar la flecha (ver main.js) */
.site-mobile-menu .site-nav-wrap .navbar-collapse:not(.show) { display: none; }

/* ---------- BOTONES ---------- */
.btn_accent {
	background: var(--qc-accent);
	border: 2px solid var(--qc-accent);
	color: #fff;
	padding: 8px 26px;
	border-radius: 30px;
	transition: .3s;
	display: inline-block;
	font-weight: 500;
	line-height: 26px;
}
.btn_accent:hover { background: var(--qc-dark); border-color: var(--qc-dark); color: #fff; }
.btn_one:focus-visible, .btn_accent:focus-visible { outline: 3px solid rgba(255, 170, 23, .45); outline-offset: 2px; }

/* ---------- HERO CON BUSCADOR ---------- */
.home_bg.hero-search { height: auto; min-height: 640px; padding-bottom: 90px; }
.home_bg.hero-search::before { background: linear-gradient(180deg, rgba(27, 32, 50, .55), rgba(27, 32, 50, .75)); }
.hero-search .hero-text { padding-top: 190px; }
.hero-search .hero-text h2 { font-size: 52px; line-height: 1.15; }
.hero-search .hero-text h2 span { color: var(--qc-accent); }
.hero-search .hero-text p { font-size: 18px; opacity: .9; }

.search-box {
	position: relative;
	max-width: 860px;
	margin: 35px auto 0;
	/* Efecto vidrio: 75% de transparencia + desenfoque del fondo para mantener legibilidad */
	background: rgba(255, 255, 255, .25);
	-webkit-backdrop-filter: blur(12px) saturate(140%);
	backdrop-filter: blur(12px) saturate(140%);
	border: 1px solid rgba(255, 255, 255, .45);
	border-radius: 14px;
	padding: 18px;
	box-shadow: 0 25px 60px -15px rgba(0, 0, 0, .45);
	text-align: left;
}
/* ---------- SLIDER CINEMÁTICO DEL MODO EMPLEOS ---------- */
/* Capas: fondo original < slider < overlay oscuro (::before) < contenido */
.home_bg.hero-search { overflow: hidden; background-color: var(--qc-dark); }
.home_bg.hero-search::before { z-index: 1; }
.hero-search > .container { position: relative; z-index: 2; }

.hero-slider {
	position: absolute; inset: 0; z-index: 0;
	opacity: 0; visibility: hidden;
	transition: opacity 1.2s ease, visibility 0s linear 1.2s;
	background: var(--qc-dark);
}
/* Slider visible (el del modo activo). Al cambiar de modo, ambos hacen un fundido cruzado. */
.hero-slider.is-on { opacity: 1; visibility: visible; transition: opacity 1.2s ease, visibility 0s; }
/* Velo oscuro sobre las fotos para que el texto blanco siempre se lea */
.home_bg.hero-search::before { background: linear-gradient(180deg, rgba(20, 24, 38, .62) 0%, rgba(20, 24, 38, .55) 45%, rgba(20, 24, 38, .82) 100%); }

.hero-slide { position: absolute; inset: 0; margin: 0; opacity: 0; transition: opacity 1.6s cubic-bezier(.4, 0, .2, 1); }
.hero-slide.is-active { opacity: 1; z-index: 1; }
.hero-slide.is-prev { opacity: 0; z-index: 0; }
.hero-slide img {
	width: 100%; height: 100%;
	object-fit: cover;
	transform: scale(1.08);
	will-change: transform;
	backface-visibility: hidden;
}
/* Ken Burns: cada foto tiene un movimiento distinto (zoom + paneo suave) */
.hero-slide.is-active img,
.hero-slide.is-prev img { animation-duration: 9s; animation-timing-function: cubic-bezier(.25, .1, .25, 1); animation-fill-mode: both; }
.hero-slide.is-active:nth-child(4n+1) img, .hero-slide.is-prev:nth-child(4n+1) img { animation-name: kb-in-left; }
.hero-slide.is-active:nth-child(4n+2) img, .hero-slide.is-prev:nth-child(4n+2) img { animation-name: kb-out-right; }
.hero-slide.is-active:nth-child(4n+3) img, .hero-slide.is-prev:nth-child(4n+3) img { animation-name: kb-in-up; }
.hero-slide.is-active:nth-child(4n+4) img, .hero-slide.is-prev:nth-child(4n+4) img { animation-name: kb-out-left; }
@keyframes kb-in-left  { from { transform: scale(1.04) translate3d(1.5%, 0, 0); }  to { transform: scale(1.16) translate3d(-1.5%, -1%, 0); } }
@keyframes kb-out-right { from { transform: scale(1.18) translate3d(-1.5%, 1%, 0); } to { transform: scale(1.05) translate3d(1.5%, 0, 0); } }
@keyframes kb-in-up    { from { transform: scale(1.05) translate3d(0, 1.5%, 0); }  to { transform: scale(1.15) translate3d(1%, -1.5%, 0); } }
@keyframes kb-out-left { from { transform: scale(1.16) translate3d(1.5%, -1%, 0); } to { transform: scale(1.04) translate3d(-1%, 1%, 0); } }

/* Indicador: área + barras de progreso */
.hero-slider-ui {
	position: absolute; z-index: 2; left: 0; right: 0; bottom: 26px;
	display: flex; align-items: center; justify-content: space-between; gap: 20px;
	max-width: 1320px; margin: 0 auto; padding: 0 24px;
	opacity: 0; transform: translateY(8px); pointer-events: none;
	transition: opacity .8s ease .3s, transform .8s ease .3s;
}
.hero-slider-ui.is-on { opacity: 1; transform: none; }
.hero-slider-caption {
	color: #fff; font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase;
	padding: 6px 14px; border-left: 2px solid var(--qc-accent);
	background: rgba(0, 0, 0, .25); backdrop-filter: blur(4px);
}
.hero-slider-caption i { color: var(--qc-accent); margin-right: 6px; }
.js-slide-caption { display: inline-block; transition: opacity .5s ease, transform .5s ease; }
.js-slide-caption.is-changing { opacity: 0; transform: translateY(6px); }
.hero-slider-bars { display: flex; gap: 8px; }
.hero-slider-bars span { width: 44px; height: 3px; border-radius: 3px; background: rgba(255, 255, 255, .3); overflow: hidden; position: relative; }
.hero-slider-bars span::after { content: ""; position: absolute; inset: 0; background: var(--qc-accent); transform: scaleX(0); transform-origin: left; }
.hero-slider-bars span.is-done::after { transform: scaleX(1); }
.hero-slider-bars span.is-active::after { animation: bar-fill var(--slide-interval, 6500ms) linear forwards; }
.hero-slider-ui.is-paused .hero-slider-bars span.is-active::after { animation-play-state: paused; }
@keyframes bar-fill { to { transform: scaleX(1); } }

@media (max-width: 767.98px) {
	.hero-slider-ui { justify-content: center; bottom: 18px; }
	.hero-slider-caption { display: none; }
	.hero-slider-bars span { width: 32px; }
}
@media (prefers-reduced-motion: reduce) {
	.hero-slide.is-active img, .hero-slide.is-prev img { animation: none !important; transform: scale(1.04); }
	.hero-slide { transition-duration: .6s; }
}

/* Selector Bienes / Empleos */
.search-switch { display: inline-flex; background: rgba(255, 255, 255, .6); border-radius: 30px; padding: 4px; margin-bottom: 14px; }
.search-switch input { position: absolute; opacity: 0; pointer-events: none; }
.search-switch label {
	cursor: pointer;
	padding: 6px 20px;
	border-radius: 30px;
	font-size: 14px;
	font-weight: 500;
	color: var(--qc-dark);
	transition: .25s;
	margin: 0;
}
.search-switch label i { margin-right: 6px; }
.search-switch input:checked + label { background: var(--qc-accent); color: #fff; box-shadow: 0 6px 14px -6px rgba(255, 170, 23, .8); }
.search-switch input:focus-visible + label { outline: 2px solid var(--qc-dark); }

.search-fields { display: flex; gap: 10px; flex-wrap: wrap; }
.search-fields .field { position: relative; flex: 1 1 200px; }
.search-fields .field--grow { flex: 2 1 280px; }
.search-fields .field i { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); color: var(--qc-muted); }
.search-fields .form-control,
.search-fields .form-select {
	height: 52px;
	border: 1px solid var(--qc-border);
	border-radius: 8px;
	padding-left: 42px;
	color: var(--qc-dark);
	font-size: 15px;
	background-color: rgba(255, 255, 255, .85);
	border-color: rgba(255, 255, 255, .6);
}
.search-fields .form-control:focus,
.search-fields .form-select:focus { border-color: var(--qc-accent); box-shadow: 0 0 0 3px rgba(255, 170, 23, .18); background-color: #fff; }
.search-fields .search-submit {
	height: 52px;
	padding: 0 30px;
	border: 0;
	border-radius: 8px;
	background: var(--qc-accent);
	color: #fff;
	font-weight: 600;
	transition: .3s;
	flex: 0 0 auto;
}
.search-fields .search-submit:hover { background: var(--qc-dark); }

.hero-tags { margin-top: 22px; color: rgba(255, 255, 255, .85); font-size: 14px; }
.hero-tags a {
	display: inline-block;
	margin: 4px 3px;
	padding: 3px 14px;
	border: 1px solid rgba(255, 255, 255, .35);
	border-radius: 30px;
	color: #fff;
	font-family: 'Poppins', sans-serif;
	font-size: 13px;
	transition: .3s;
}
.hero-tags a:hover { background: var(--qc-accent); border-color: var(--qc-accent); }
/* El estilo genérico .hero-text a del template no debe afectar a los chips */
.hero-search .hero-text .hero-tags a { box-shadow: none; margin-top: 4px; padding: 3px 14px; background: transparent; border-width: 1px; }
.hero-search .hero-text .hero-tags a:hover { background: var(--qc-accent); border: 1px solid var(--qc-accent); }

/* ---------- CABECERAS DE SECCIÓN ---------- */
.section-title h2 { font-size: 44px; }
.section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 40px; flex-wrap: wrap; }
.section-head h2 { font-size: 40px; font-weight: 600; margin-bottom: 6px; }
.section-head p { margin: 0; }
.section-head .eyebrow,
.eyebrow { color: var(--qc-accent); text-transform: uppercase; letter-spacing: 2px; font-size: 13px; font-weight: 600; display: block; margin-bottom: 6px; }
.bg-soft { background: var(--qc-soft); }

/* Cabecera interna (páginas Bienes / Empleos) */
.section-top.page-hero { padding-top: 150px; padding-bottom: 70px; }
.section-top.page-hero::before { content: ""; position: absolute; inset: 0; background: rgba(27, 32, 50, .55); }
.section-top-title p { color: rgba(255, 255, 255, .85); position: relative; margin: 8px 0 0; }
.breadcrumb-qc { position: relative; list-style: none; padding: 0; margin: 0 0 10px; display: flex; justify-content: center; gap: 8px; font-size: 14px; }
.breadcrumb-qc li, .breadcrumb-qc a { color: rgba(255, 255, 255, .8); }
.breadcrumb-qc li + li::before { content: "/"; margin-right: 8px; opacity: .6; }
.breadcrumb-qc a:hover { color: var(--qc-accent); }

/* ---------- TARJETA DE PRODUCTO / SERVICIO ---------- */
.product-card {
	background: #fff;
	border: 1px solid var(--qc-border);
	border-radius: var(--qc-radius);
	overflow: hidden;
	height: 100%;
	display: flex;
	flex-direction: column;
	transition: .3s;
}
.product-card:hover { box-shadow: 0 40px 50px -20px rgba(0, 0, 0, .15); transform: translateY(-6px); }
.product-card__media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #f1f2f5; }
.product-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.product-card:hover .product-card__media img { transform: scale(1.05); }
.product-card__badge {
	position: absolute; top: 12px; left: 12px;
	background: var(--qc-dark); color: #fff;
	font-size: 12px; font-weight: 500; line-height: 1;
	padding: 6px 12px; border-radius: 30px;
}
.product-card__badge--new { background: #1f9d6b; }
.product-card__badge--service { background: var(--qc-accent); }
.product-card__fav {
	position: absolute; top: 10px; right: 10px;
	width: 36px; height: 36px; border-radius: 50%;
	background: rgba(255, 255, 255, .95); color: var(--qc-dark);
	display: flex; align-items: center; justify-content: center;
	border: 0; transition: .3s;
}
.product-card__fav:hover { color: #e0435a; }
.product-card__body { padding: 18px 20px 20px; display: flex; flex-direction: column; flex: 1; }
.product-card__cat { color: var(--qc-accent); font-size: 12px; text-transform: uppercase; letter-spacing: 1px; font-weight: 600; }
.product-card__title { font-size: 19px; line-height: 1.35; margin: 6px 0 8px; }
.product-card__title a { color: var(--qc-dark); transition: .3s; }
.product-card__title a:hover { color: var(--qc-accent); }
.product-card__meta { font-size: 13px; color: var(--qc-muted); margin-bottom: 14px; }
.product-card__meta i { margin-right: 4px; }
.product-card__footer { margin-top: auto; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--qc-border); padding-top: 14px; }
.product-card__price { font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 500; color: var(--qc-dark); }
.product-card__price small { font-family: 'Poppins', sans-serif; font-size: 12px; color: var(--qc-muted); font-weight: 400; }
.product-card__link { font-size: 14px; font-weight: 500; color: var(--qc-dark); }
.product-card__link:hover { color: var(--qc-accent); }

/* ---------- TARJETA HORIZONTAL DE EMPLEO ---------- */
.job-list { display: flex; flex-direction: column; gap: 16px; }
.job-card {
	display: flex;
	align-items: center;
	gap: 22px;
	background: #fff;
	border: 1px solid var(--qc-border);
	border-left: 4px solid transparent;
	border-radius: var(--qc-radius);
	padding: 22px 26px;
	transition: .3s;
}
.job-card:hover { border-left-color: var(--qc-accent); box-shadow: var(--qc-shadow); }
.job-card__logo {
	flex: 0 0 64px; height: 64px; border-radius: 12px;
	display: flex; align-items: center; justify-content: center;
	font-family: 'Oswald', sans-serif; font-size: 22px; font-weight: 500;
	color: #fff; background: var(--qc-dark);
}
.job-card__logo--a { background: #2b6cb0; }
.job-card__logo--b { background: #1f9d6b; }
.job-card__logo--c { background: #b4507a; }
.job-card__logo--d { background: var(--qc-accent); }
.job-card__logo--e { background: #6b5bd2; }
.job-card__info { flex: 1; min-width: 0; }
.job-card__title { font-size: 20px; margin: 0 0 4px; }
.job-card__title a { color: var(--qc-dark); transition: .3s; }
.job-card__title a:hover { color: var(--qc-accent); }
.job-card__company { font-size: 15px; color: var(--qc-text); margin-bottom: 8px; }
.job-card__company i { color: var(--qc-muted); margin-right: 4px; }
.job-card__tags { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; color: var(--qc-muted); }
.job-card__tags i { margin-right: 4px; color: var(--qc-accent); }
.job-chip { display: inline-block; padding: 2px 10px; border-radius: 30px; font-size: 12px; font-weight: 500; background: #f3f4f7; color: var(--qc-dark); }
.job-chip--remote { background: #e6f6ef; color: #1f7a55; }
.job-chip--hybrid { background: #eef0ff; color: #4b44a8; }
.job-chip--onsite { background: #fff4e0; color: #9a5d00; }
.job-card__side { flex: 0 0 auto; text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.job-card__salary { font-family: 'Oswald', sans-serif; font-size: 18px; color: var(--qc-dark); }
.job-card__date { font-size: 12px; color: var(--qc-muted); }
.job-card__side .btn_accent { padding: 6px 22px; font-size: 14px; }

/* ---------- SIDEBAR DE FILTROS (estilo widgets del blog del template) ---------- */
.filter-sidebar .filter_widget {
	margin-bottom: 24px;
	background: #fff;
	padding: 24px 26px;
	border-radius: var(--qc-radius);
	border-top: 3px solid var(--qc-accent);
	box-shadow: var(--qc-shadow);
}
.filter-sidebar .blog_sidebar_title { font-size: 18px; text-transform: none; }
.filter-list { list-style: none; margin: 0; padding: 0; }
.filter-list li { display: flex; align-items: center; justify-content: space-between; padding: 4px 0; }
.filter-list .form-check { margin: 0; }
.filter-list .form-check-label { font-size: 14px; color: var(--qc-dark); cursor: pointer; }
.filter-list .count { font-size: 12px; color: var(--qc-muted); background: #f3f4f7; border-radius: 20px; padding: 0 9px; }
.filter-sidebar .form-check-input:checked { background-color: var(--qc-accent); border-color: var(--qc-accent); }
.filter-sidebar .form-check-input:focus { box-shadow: 0 0 0 3px rgba(255, 170, 23, .25); border-color: var(--qc-accent); }
.filter-sidebar .form-control,
.filter-sidebar .form-select { height: 44px; border-radius: 6px; border-color: var(--qc-border); font-size: 14px; }
.filter-sidebar .form-control:focus,
.filter-sidebar .form-select:focus { border-color: var(--qc-accent); box-shadow: 0 0 0 3px rgba(255, 170, 23, .18); }
.price-range { display: flex; align-items: center; gap: 8px; }
.price-range .input-group-text { background: #f3f4f7; border-color: var(--qc-border); font-size: 13px; }
.filter-actions { display: flex; gap: 10px; }
.filter-actions .btn_accent { flex: 1; text-align: center; }
.filter-reset { font-size: 14px; color: var(--qc-muted); align-self: center; }
.filter-reset:hover { color: var(--qc-accent); }
.filter-toggle { display: none; }

/* ---------- BARRA DE RESULTADOS ---------- */
.results-bar {
	display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
	background: #fff; border: 1px solid var(--qc-border); border-radius: var(--qc-radius);
	padding: 12px 18px; margin-bottom: 24px;
}
.results-bar p { margin: 0; font-size: 14px; }
.results-bar strong { color: var(--qc-dark); }
.results-bar .form-select { width: auto; font-size: 14px; border-color: var(--qc-border); }
.results-bar .form-select:focus { border-color: var(--qc-accent); box-shadow: none; }

/* ---------- PAGINACIÓN ---------- */
.pagination-qc { display: flex; justify-content: center; gap: 8px; list-style: none; padding: 0; margin: 40px 0 0; }
.pagination-qc a,
.pagination-qc span {
	display: flex; align-items: center; justify-content: center;
	min-width: 42px; height: 42px; padding: 0 12px; border-radius: 50px;
	border: 1px solid var(--qc-border); color: var(--qc-dark); background: #fff; font-size: 14px; transition: .3s;
}
.pagination-qc a:hover,
.pagination-qc .active span { background: var(--qc-accent); border-color: var(--qc-accent); color: #fff; }

/* ---------- BANDA CTA ---------- */
.cta-band { background: var(--qc-dark); border-radius: 16px; padding: 50px 56px; position: relative; overflow: hidden; }
.cta-band::after { content: ""; position: absolute; right: -60px; top: -60px; width: 240px; height: 240px; border-radius: 50%; background: rgba(255, 170, 23, .15); }
.cta-band h3 { color: #fff; font-size: 34px; font-weight: 600; margin-bottom: 8px; }
.cta-band p { color: #a9b4c7; margin: 0; }
.cta-band .cta-actions { position: relative; z-index: 1; display: flex; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
.cta-band .btn_one { margin: 0; background: transparent; color: #fff; border-color: #fff; }
.cta-band .btn_one:hover { background: var(--qc-accent); border-color: var(--qc-accent); }

/* ---------- FOOTER ---------- */
.single_footer ul li a,
.footer_copyright p { text-transform: none; font-family: 'Poppins', sans-serif; }
.footer-contact li { color: #fff; font-size: 15px; font-weight: 300; line-height: 36px; }
.footer-contact li i { color: var(--qc-accent); margin-right: 8px; }
.footer-credit { font-size: 13px; opacity: .7; }
.footer_copyright a { color: var(--qc-accent); }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 991.98px) {
	.filter-toggle {
		display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%;
		margin-bottom: 20px; padding: 12px; border-radius: 8px;
		background: var(--qc-dark); color: #fff; border: 0; font-weight: 500;
	}
	.filter-sidebar.collapse:not(.show) { display: none; }
	.cta-band { padding: 40px 30px; text-align: center; }
	.cta-band .cta-actions { justify-content: center; margin-top: 20px; }
}
@media (min-width: 992px) {
	/* En escritorio los filtros siempre están visibles */
	.filter-sidebar.collapse { display: block !important; }
}
@media (max-width: 767.98px) {
	.hero-search .hero-text { padding-top: 130px; }
	.hero-search .hero-text h2 { font-size: 34px; }
	.search-box { padding: 14px; }
	.search-fields .search-submit { width: 100%; }
	.section-title h2, .section-head h2 { font-size: 32px; }
	.section-top.page-hero { padding-top: 120px; padding-bottom: 50px; }
	.job-card { flex-wrap: wrap; padding: 18px; gap: 14px; }
	.job-card__logo { flex-basis: 52px; height: 52px; font-size: 18px; }
	.job-card__info { flex-basis: calc(100% - 70px); }
	.job-card__side { width: 100%; flex-direction: row; align-items: center; justify-content: space-between; text-align: left; border-top: 1px solid var(--qc-border); padding-top: 12px; }
	.cta-band h3 { font-size: 26px; }
}

/* ======================================================================
 * PANTALLA DE ACCESO (login / registro con Google)
 * ==================================================================== */
.auth-body { background: #f4f6fa; min-height: 100vh; }
.auth-page { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); min-height: 100vh; }

/* Panel visual con slider */
.auth-visual {
	position: relative; overflow: hidden; background: var(--qc-dark); color: #fff;
	display: flex; flex-direction: column; justify-content: space-between; padding: 44px 56px;
}
.auth-visual::before {
	content: ""; position: absolute; inset: 0; z-index: 1;
	background:
		linear-gradient(180deg, rgba(20, 24, 38, .55) 0%, rgba(20, 24, 38, .35) 40%, rgba(20, 24, 38, .9) 100%),
		linear-gradient(90deg, rgba(20, 24, 38, .35), transparent 60%);
}
.auth-visual__top, .auth-visual__body, .auth-visual__foot { position: relative; z-index: 2; }
.auth-visual .brand-logo { font-size: 30px; }
.auth-visual__body { max-width: 520px; }
.auth-visual__body .eyebrow { color: var(--qc-accent); }
.auth-visual__body h2 { color: #fff; font-size: 46px; line-height: 1.12; font-weight: 600; text-transform: uppercase; margin-bottom: 26px; }
.auth-visual__body h2 span { color: var(--qc-accent); }
.auth-features { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.auth-features li { display: flex; align-items: center; gap: 14px; font-size: 15px; color: rgba(255, 255, 255, .9); }
.auth-features i {
	flex: 0 0 38px; height: 38px; border-radius: 10px; display: flex; align-items: center; justify-content: center;
	background: rgba(255, 170, 23, .18); color: var(--qc-accent); backdrop-filter: blur(4px);
}
.auth-visual__foot { font-size: 13px; color: rgba(255, 255, 255, .6); }

/* Panel del formulario */
.auth-panel { display: flex; align-items: center; justify-content: center; padding: 48px 24px; }
.auth-card {
	width: 100%; max-width: 440px; background: #fff; border-radius: 18px; padding: 40px 38px;
	box-shadow: 0 30px 70px -30px rgba(27, 32, 50, .35); border-top: 4px solid var(--qc-accent);
}
.auth-brand-mobile { display: none; }
.brand-logo--dark { color: var(--qc-dark); }

.auth-tabs { display: flex; background: #f0f2f6; border-radius: 30px; padding: 4px; margin-bottom: 28px; }
.auth-tabs a {
	flex: 1; text-align: center; padding: 8px 10px; border-radius: 30px;
	font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 500; color: var(--qc-dark); transition: .25s;
}
.auth-tabs a:hover { color: var(--qc-accent); }
.auth-tabs a.is-active { background: var(--qc-accent); color: #fff; box-shadow: 0 6px 14px -6px rgba(255, 170, 23, .8); }

.auth-title { font-size: 32px; font-weight: 600; margin-bottom: 8px; }
.auth-subtitle { font-size: 15px; line-height: 1.6; margin-bottom: 26px; }

/* Botón de Google (según las pautas de marca de Google: fondo blanco, logo "G" a color) */
.btn-google {
	display: flex; align-items: center; justify-content: center; gap: 12px;
	width: 100%; height: 54px; border-radius: 10px;
	border: 1px solid #dadce0; background: #fff; color: #1f1f1f;
	font-family: 'Poppins', sans-serif; font-size: 15px; font-weight: 500;
	transition: background .2s, box-shadow .2s, border-color .2s, transform .2s;
}
.btn-google:hover { background: #f8faff; border-color: #c6d4f5; box-shadow: 0 8px 20px -10px rgba(66, 133, 244, .55); transform: translateY(-1px); }
.btn-google:focus-visible { outline: 3px solid rgba(66, 133, 244, .45); outline-offset: 2px; }
.btn-google:disabled { opacity: .55; cursor: not-allowed; transform: none; box-shadow: none; }

.auth-divider { display: flex; align-items: center; gap: 12px; margin: 26px 0 14px; color: var(--qc-muted); font-size: 12px; text-transform: uppercase; letter-spacing: 1px; }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--qc-border); }
.auth-benefits { list-style: none; padding: 0; margin: 0 0 22px; display: grid; gap: 8px; }
.auth-benefits li { font-size: 14px; color: var(--qc-dark); display: flex; align-items: center; gap: 10px; }
.auth-benefits i { color: #1f9d6b; font-size: 13px; }
.auth-switch { font-size: 14px; text-align: center; margin: 18px 0 0; }
.auth-switch a, .auth-legal a { color: var(--qc-accent); font-weight: 500; }
.auth-switch a:hover, .auth-legal a:hover { color: var(--qc-dark); }
.auth-legal { font-size: 12px; line-height: 1.6; color: var(--qc-muted); text-align: center; margin: 16px 0 0; }

.auth-alert {
	display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.5;
	padding: 12px 14px; border-radius: 10px; margin-bottom: 18px;
	background: #eef4ff; color: #2a4a8a; border: 1px solid #d5e2fb;
}
.auth-alert i { margin-top: 3px; }
.auth-alert code { font-size: 12px; color: inherit; background: rgba(0, 0, 0, .06); padding: 1px 5px; border-radius: 4px; }
.auth-alert--warning { background: #fff7e8; color: #8a5a00; border-color: #ffe1a8; }
.auth-alert--error { background: #fdeeee; color: #a12c2c; border-color: #f6caca; }
.auth-alert--success { background: #e9f7f1; color: #1f7a55; border-color: #c4ead9; }

.auth-state { width: 64px; height: 64px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 18px; background: #f0f2f6; color: var(--qc-dark); font-size: 24px; }
.auth-state--error { background: #fdeeee; color: #c43c3c; }
.auth-form .form-control { height: 48px; border-radius: 8px; }

@media (max-width: 991.98px) {
	.auth-page { grid-template-columns: 1fr; }
	.auth-visual { display: none; }
	.auth-brand-mobile { display: block; text-align: center; margin-bottom: 22px; font-size: 28px; }
	.auth-body { background: linear-gradient(180deg, var(--qc-dark) 0 260px, #f4f6fa 260px); }
}
@media (max-width: 575.98px) {
	.auth-panel { padding: 28px 14px; }
	.auth-card { padding: 30px 22px; }
	.auth-title { font-size: 28px; }
}

/* ======================================================================
 * MENÚ DE USUARIO EN EL NAVBAR
 * ==================================================================== */
.site-navbar .site-navigation .site-menu > li.nav-user > a { display: inline-flex; align-items: center; gap: 8px; }
.nav-avatar {
	width: 34px; height: 34px; border-radius: 50%; object-fit: cover;
	border: 2px solid var(--qc-accent); background: var(--qc-accent); color: #fff;
	display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600;
}
.nav-user .dropdown .nav-logout-form { margin: 0; }
.nav-user .dropdown .nav-logout-btn {
	width: 100%; text-align: left; background: none; border: 0;
	padding: 9px 20px; font-size: 16px; color: #c43c3c; font-family: 'Oswald', sans-serif;
}
.nav-user .dropdown .nav-logout-btn:hover { background: #eff1f3; }
.site-mobile-menu .nav-logout-btn { background: none; border: 0; padding: 10px 0; color: #c43c3c; }

/* Avisos (mensajes de Django) en las páginas internas */
.qc-toasts { position: fixed; top: 92px; right: 20px; z-index: 3000; display: grid; gap: 10px; max-width: 360px; }
.qc-toast {
	background: #fff; border-left: 4px solid var(--qc-accent); border-radius: 10px; padding: 12px 16px;
	box-shadow: 0 18px 40px -16px rgba(0, 0, 0, .35); font-size: 14px; color: var(--qc-dark);
	animation: toast-in .45s ease both, toast-out .45s ease 5s forwards;
}
@keyframes toast-in { from { opacity: 0; transform: translateY(-10px); } }
@keyframes toast-out { to { opacity: 0; transform: translateY(-10px); visibility: hidden; } }

/* ======================================================================
 * VERIFICACIÓN DE IDENTIDAD (DNI)
 * ==================================================================== */
.auth-card--wide { max-width: 560px; }
.verify-steps { list-style: none; display: flex; gap: 6px; padding: 0; margin: 0 0 24px; counter-reset: s; }
.verify-steps li {
	flex: 1; display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 500; color: var(--qc-muted);
	padding-bottom: 10px; border-bottom: 3px solid #e8eaf0;
}
.verify-steps li span {
	flex: 0 0 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
	background: #e8eaf0; color: var(--qc-muted); font-size: 12px;
}
.verify-steps li.is-done { color: #1f7a55; border-color: #1f9d6b; }
.verify-steps li.is-done span { background: #1f9d6b; color: #fff; }
.verify-steps li.is-current { color: var(--qc-dark); border-color: var(--qc-accent); }
.verify-steps li.is-current span { background: var(--qc-accent); color: #fff; }

/* Tarjeta DNI ilustrativa */
.dni-hint { display: flex; align-items: center; gap: 18px; background: #f6f7fb; border: 1px dashed #d7dbe6; border-radius: 12px; padding: 14px 16px; margin-bottom: 22px; }
.dni-hint p { margin: 0; font-size: 13px; line-height: 1.55; }
.dni-card {
	flex: 0 0 170px; border-radius: 9px; padding: 8px 10px; color: #23344f; font-family: 'Poppins', sans-serif;
	background: linear-gradient(135deg, #e3f0fb, #f6eadb); box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .35);
}
.dni-card__top { display: flex; justify-content: space-between; font-size: 7px; font-weight: 600; letter-spacing: .5px; }
.dni-card__body { display: flex; gap: 8px; margin: 6px 0; }
.dni-card__photo { width: 32px; height: 38px; border-radius: 4px; background: #c9d6e6; display: flex; align-items: center; justify-content: center; color: #7d8fa8; font-size: 16px; }
.dni-card__lines { flex: 1; display: grid; gap: 5px; align-content: center; }
.dni-card__lines i { display: block; height: 4px; border-radius: 3px; background: #b9c6d8; }
.dni-card__lines i.short { width: 60%; }
.dni-card__number { font-size: 13px; font-weight: 600; letter-spacing: 1px; }
.dni-card__number mark { background: var(--qc-accent); color: #fff; padding: 0 4px; border-radius: 4px; animation: dni-pulse 2s ease-in-out infinite; }
@keyframes dni-pulse { 50% { box-shadow: 0 0 0 4px rgba(255, 170, 23, .3); } }

.verify-form .form-label { font-size: 13px; font-weight: 500; color: var(--qc-dark); margin-bottom: 4px; }
.verify-form .req { color: #c43c3c; }
.verify-form .form-control { height: 46px; border-radius: 8px; border-color: #dfe2ea; font-size: 15px; }
.verify-form .form-control:focus { border-color: var(--qc-accent); box-shadow: 0 0 0 3px rgba(255, 170, 23, .18); }
.verify-form input[name="digito"] { text-align: center; font-weight: 600; text-transform: uppercase; }
.verify-checks { margin: 20px 0 18px; display: grid; gap: 10px; }
.verify-checks .form-check-label { font-size: 13px; line-height: 1.5; color: var(--qc-text); }
.verify-checks .form-check-label a { color: var(--qc-accent); }
.verify-checks .form-check-input:checked { background-color: var(--qc-accent); border-color: var(--qc-accent); }
.verify-error { font-size: 13px; color: #c43c3c; }
.verify-submit { height: 52px; font-size: 16px; }
.verify-attempts { font-size: 12px; color: var(--qc-muted); text-align: center; margin: 10px 0 0; }
.link-button { background: none; border: 0; padding: 0; color: var(--qc-accent); font-weight: 500; }
.link-button:hover { color: var(--qc-dark); }

/* Insignia "verificado" en el navbar */
.nav-verified {
	display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; border-radius: 50%;
	background: #1f9d6b; color: #fff; font-size: 9px; margin-left: 2px;
}

/* Página legal */
.legal-doc { background: #fff; border-radius: var(--qc-radius); padding: 40px 44px; box-shadow: var(--qc-shadow); }
.legal-doc h2 { font-size: 22px; font-weight: 600; margin: 26px 0 10px; }
.legal-doc h2:first-child { margin-top: 0; }
.legal-doc li { margin-bottom: 6px; }

@media (max-width: 575.98px) {
	.dni-hint { flex-direction: column; align-items: flex-start; }
	.verify-steps li { font-size: 11px; }
	.legal-doc { padding: 26px 20px; }
}