/* =========================================================
   Gollo Ópticas — marca sobre el tema Óptica La Curacao
   Se carga detrás de todas las hojas del padre: con la misma especificidad
   gana por orden. Colores tomados del diseño (Sitio Web-Gollo Opt).
   ========================================================= */

:root {
	--oc-gollo-azul: #0D62AA;
	--oc-gollo-naranja: #EC4E01;
	--oc-gollo-naranja-claro: #EF9E37;
	--oc-gollo-pie: #4A9EBB;
	--oc-gollo-titulo: #3B77BC;
}

/* ---------- Cabecera ---------- */
.oc-header {
	background: linear-gradient(105deg, var(--oc-gollo-azul) 0%, #4C9BD8 65%, #A3D0F0 100%);
}

.oc-header__top {
	padding-top: 16px;
	padding-bottom: 24px;
}

/* El gallo sobre el logo le quita altura al texto: va más alto que el de La Curacao. */
figure.oc-logo--img img {
	height: 60px;
}

.oc-btn-cita .wp-block-button__link {
	background: var(--oc-gollo-naranja);
}

.oc-btn-cita .wp-block-button__link:hover {
	background: #C94200;
}

.oc-nav .wp-block-navigation-item__content:hover {
	color: #FFE0CC;
}

.oc-mobile-nav .wp-block-navigation__responsive-container-close {
	color: var(--oc-gollo-azul);
}

/* ---------- Botón «AGENDÁ TU CITA» (.oc-btn-haz del padre, en naranja) ---------- */
.oc-btn-haz .wp-block-button__link {
	background: linear-gradient(180deg, #F67A3C 0%, #EC5A12 52%, #E04B00 100%);
	border-color: #C93F00;
	box-shadow: inset 0 2px 3px rgba(255, 255, 255, .45), 0 10px 24px rgba(201, 63, 0, .35);
}

/* «AGENDÁ TU CITA» es más largo que «HAZ TU CITA»: la píldora del CTA de
   asesoría reserva más hueco para el botón montado sobre su borde. */
.oc-cta-asesoria {
	max-width: 880px;
	padding-right: 350px;
}

@media (max-width: 980px) {
	.oc-cta-asesoria {
		max-width: 680px;
		padding-right: 300px;
	}
}

@media (max-width: 640px) {
	.oc-cta-asesoria {
		max-width: 100%;
		padding-right: 22px;
	}
}

/* ---------- Agenda en 3 pasos (Appointments Next) ---------- */
/* Sólo los círculos del indicador van en naranja. El plugin los pinta con
   #0081a7 fijo (sin variable), así que se redeclaran. */
.oc-wizard .app-progress-circle,
.oc-wizard .app-progress-step.completed .app-progress-circle {
	background: var(--oc-gollo-naranja);
	border-color: var(--oc-gollo-naranja);
}

.oc-wizard .app-progress-indicator {
	--text-color-primary: var(--oc-gollo-naranja);
}

.oc-wizard .app-progress-step.active .app-progress-circle {
	background: var(--oc-gollo-naranja);
	box-shadow: 0 0 0 2px var(--oc-gollo-naranja);
}

/* ---------- Banda «Pasá por Gollo Ópticas…» ---------- */
.oc-cta-band {
	background: linear-gradient(90deg, var(--oc-gollo-naranja-claro) 0%, var(--oc-gollo-naranja) 100%);
	padding: 64px 20px 68px;
}

.oc-cta-band__title {
	font-weight: 800;
	line-height: 1.1;
}

/* ---------- Video ---------- */
.oc-video__title {
	color: var(--oc-gollo-titulo);
}

/* ---------- Pie ---------- */
.oc-footer {
	background: var(--oc-gollo-pie);
}

figure.oc-logo--footer.oc-logo--img img {
	height: 60px;
}

/* Con 60px el logo (y su frase) no deja sitio a la hamburguesa en móvil. */
@media (max-width: 600px) {
	figure.oc-logo--img img,
	figure.oc-logo--footer.oc-logo--img img {
		height: 44px;
	}

	/* El salto de línea del diseño deja «empezá» sola en móvil. */
	.oc-cta-band__title br {
		display: none;
	}
}