/* =====================================================
		 * GLOBAL FRONTEND VARIABLES
		 * ===================================================== */

		.ipogmphub-component {

			--ipogmphub-primary: #1264d8;
			--ipogmphub-primary-dark: #0d4fae;
			--ipogmphub-text: #152238;
			--ipogmphub-muted: #68758a;
			--ipogmphub-border: #e5ebf3;
			--ipogmphub-surface: #ffffff;
			--ipogmphub-soft: #f5f8fc;
			--ipogmphub-radius: 16px;

			box-sizing: border-box;

			width: 100%;

			margin: 28px 0;

			padding: 24px;

			background:
				var(--ipogmphub-surface);

			border:
				1px solid
				var(--ipogmphub-border);

			border-radius:
				var(--ipogmphub-radius);

			color:
				var(--ipogmphub-text);

			font-family:
				inherit;

			overflow:
				hidden;
		}


		.ipogmphub-component *,
		.ipogmphub-component *::before,
		.ipogmphub-component *::after {

			box-sizing:
				border-box;
		}


		/* =====================================================
		 * COMMON COMPONENT HEADER
		 * ===================================================== */

		.ipogmphub-component-header,
		.ipogmphub-section-heading {

			display:
				flex;

			align-items:
				center;

			justify-content:
				space-between;

			gap:
				16px;

			margin-bottom:
				22px;
		}


		.ipogmphub-section-heading h2,
		.ipogmphub-component-title {

			margin:
				3px 0 0;

			padding:
				0;

			color:
				var(--ipogmphub-text);

			font-size:
				24px;

			line-height:
				1.25;

			font-weight:
				700;
		}


		.ipogmphub-eyebrow {

			display:
				block;

			margin-bottom:
				4px;

			color:
				var(--ipogmphub-primary);

			font-size:
				12px;

			font-weight:
				700;

			letter-spacing:
				.08em;

			text-transform:
				uppercase;
		}


		.ipogmphub-company-heading {

			display:
				flex;

			align-items:
				center;

			gap:
				14px;

			min-width:
				0;
		}



		

		/* =====================================================
		 * ALLOTMENT
		 * ===================================================== */

		.ipogmphub-action-row {

			display:
				flex;

			flex-wrap:
				wrap;

			gap:
				10px;

			margin-top:
				20px;
		}


		.ipogmphub-button {

			display:
				inline-flex;

			align-items:
				center;

			justify-content:
				center;

			min-height:
				44px;

			padding:
				10px 17px;

			background:
				var(--ipogmphub-primary);

			border:
				1px solid
				var(--ipogmphub-primary);

			border-radius:
				10px;

			color:
				#fff;

			font-size:
				14px;

			font-weight:
				700;

			text-decoration:
				none;

			transition:
				.2s ease;
		}


		.ipogmphub-button:hover {

			background:
				var(--ipogmphub-primary-dark);

			color:
				#fff;

			text-decoration:
				none;
		}


		.ipogmphub-button-secondary {

			background:
				#fff;

			color:
				var(--ipogmphub-primary);
		}


		.ipogmphub-button-secondary:hover {

			background:
				var(--ipogmphub-soft);

			color:
				var(--ipogmphub-primary-dark);
		}




/* =====================================================
 * SHARED RESPONSIVE
 * ===================================================== */

@media (max-width: 700px) {
    .ipogmphub-component {
        margin: 22px 0;
        padding: 18px;
        border-radius: 13px;
    }

    .ipogmphub-component-header,
    .ipogmphub-section-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .ipogmphub-component-title,
    .ipogmphub-section-heading h2 {
        font-size: 21px;
    }

    .ipogmphub-action-row {
        flex-direction: column;
    }

    .ipogmphub-button {
        width: 100%;
    }
}

@media (max-width: 380px) {
    .ipogmphub-component {
        padding: 15px;
    }
}