/* ── GLOBAL ── */
		:root {
			--navy: #17225B;
			--gold: #B17E39;
			--gold-light: rgba(177, 126, 57, 0.12);
			--navy-light: rgba(23, 34, 91, 0.08);
			--text: #1e2a47;
		}

		/* custom scrollbar */
		::-webkit-scrollbar {
			width: 6px;
		}

		::-webkit-scrollbar-track {
			background: #eef2f8;
		}

		::-webkit-scrollbar-thumb {
			background: var(--gold);
			border-radius: 6px;
		}

		/* ── HERO INTRO SECTION ── */
		.tp-intro-section {
			padding: 70px 0 50px;
			background: linear-gradient(135deg, #f8f9fc 0%, #ffffff 100%);
			position: relative;
			overflow: hidden;
		}

		.tp-intro-section::before {
			content: '';
			position: absolute;
			inset: 0;
			background-image: radial-gradient(circle at 15% 50%, rgba(23, 34, 91, 0.04) 2%, transparent 2.5%);
			background-size: 48px 48px;
			pointer-events: none;
		}

		.tp-intro-card {
			background: #fff;
			border-radius: 32px;
			padding: 50px 48px;
			box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.10), 0 0 0 1px rgba(255, 255, 255, 0.6);
			position: relative;
			z-index: 2;
		}

		/* section heading style (matches services page h4) */
		.tp-section-heading {
			font-size: 2.1rem;
			font-weight: 700;
			background: #1e3238;
			-webkit-background-clip: text;
			background-clip: text;
			color: transparent;
			display: inline-block;
			letter-spacing: -0.3px;
			position: relative;
		}

		.tp-section-heading::after {
			content: '';
			display: block;
			width: 70px;
			height: 4px;
			/* background: linear-gradient(90deg, var(--gold), #d49a47); */
			border-radius: 4px;
			margin-top: 14px;
		}

		.tp-section-heading.centered::after {
			margin-left: auto;
			margin-right: auto;
		}

		.tp-intro-text {
			font-size: 1.05rem;
			color: #475569;
			line-height: 1.85;
			margin-top: 18px;
		}

		/* accent badge */
		.tp-badge {
			display: inline-flex;
			align-items: center;
			gap: 8px;
			background: var(--gold-light);
			color: var(--gold);
			font-weight: 600;
			font-size: 0.85rem;
			padding: 6px 16px;
			border-radius: 50px;
			border: 1px solid rgba(177, 126, 57, 0.25);
			margin-bottom: 18px;
			letter-spacing: 0.5px;
			text-transform: uppercase;
		}

		/* ── APPROACH SECTION ── */
		.tp-approach-section {
			padding: 70px 0;
			background: #fff;
		}

		.approach-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

/* Second row wrapper */
.approach-grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    justify-content: center;
    max-width: 700px;   /* control width */
    margin: 20px auto 0; /* center horizontally */
}

		.approach-card {
			background: #fafbff;
			border: 1px solid rgba(23, 34, 91, 0.08);
			border-radius: 20px;
			padding: 28px 26px;
			display: flex;
			align-items: flex-start;
			gap: 18px;
			transition: all 0.28s ease;
			position: relative;
			overflow: hidden;
		}

		.approach-card::before {
			content: '';
			position: absolute;
			left: 0;
			top: 0;
			bottom: 0;
			width: 4px;
			background: linear-gradient(var(--navy), var(--gold));
			opacity: 0;
			transition: 0.28s;
		}

		.approach-card:hover {
			transform: translateY(-6px);
			box-shadow: 0 18px 38px rgba(23, 34, 91, 0.10);
			border-color: var(--gold);
		}

		.approach-card:hover::before {
			opacity: 1;
		}

		.approach-num {
			min-width: 46px;
			height: 46px;
			background: #ecab23;
			color: #fff;
			border-radius: 14px;
			display: flex;
			align-items: center;
			justify-content: center;
			font-weight: 700;
			font-size: 1.1rem;
			flex-shrink: 0;
			transition: transform 0.28s;
		}

		.approach-card:hover .approach-num {
			transform: scale(1.1) rotate(-5deg);
		}

		.approach-text {
			font-size: 0.97rem;
			font-weight: 500;
			color: var(--text);
			line-height: 1.55;
		}

		/* ── IMAGE + TEXT SPLIT ── */
		.tp-split-section {
			padding: 70px 0;
			background: linear-gradient(135deg, #f8f9fc, #ffffff);
		}

		.tp-split-image {
			padding: 10px;
			background: linear-gradient(135deg, #f3f6ff, #ffffff);
			border-radius: 28px;
		}

		.tp-split-image img {
			max-width: 100%;
			border-radius: 20px;
			box-shadow: 0 20px 45px rgba(0, 0, 0, 0.12);
			transition: 0.4s;
		}

		.tp-split-image img:hover {
			transform: scale(1.03);
		}

		/* ── KEY AREAS SECTION ── */
		.tp-areas-section {
			padding: 70px 0;
			background: #fff;
		}

		.areas-grid {
			display: grid;
			grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
			gap: 24px;
			margin-top: 40px;
		}

		.area-card {
			background: #fff;
			border-radius: 20px;
			padding: 30px 26px;
			box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
			border: 1px solid rgba(23, 34, 91, 0.07);
			transition: all 0.3s ease;
			position: relative;
			overflow: hidden;
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			gap: 14px;
		}

		.area-card::after {
			content: '';
			position: absolute;
			inset: 0;
			background: #17225B;
			opacity: 0;
			transition: 0.35s;
			z-index: 0;
		}

		.area-card:hover::after {
			opacity: 1;
		}

		.area-card:hover {
			transform: translateY(-8px);
			box-shadow: 0 22px 45px rgba(23, 34, 91, 0.18);
		}

		.area-icon-wrap {
			width: 54px;
			height: 54px;
			background: var(--navy-light);
			border-radius: 16px;
			display: flex;
			align-items: center;
			justify-content: center;
			position: relative;
			z-index: 1;
			transition: 0.3s;
		}

		.area-icon-wrap i {
			font-size: 22px;
			color: var(--navy);
			transition: 0.3s;
		}

		.area-card:hover .area-icon-wrap {
			background: rgba(255, 255, 255, 0.2);
		}

		.area-card:hover .area-icon-wrap i {
			color: #fff;
		}

		.area-num {
			font-size: 0.75rem;
			font-weight: 700;
			color: var(--gold);
			text-transform: uppercase;
			letter-spacing: 1.5px;
			position: relative;
			z-index: 1;
			transition: 0.3s;
		}

		.area-card:hover .area-num {
			color: rgba(255, 255, 255, 0.6);
		}

		.area-title {
			font-size: 1rem;
			font-weight: 700;
			color: var(--text);
			line-height: 1.4;
			position: relative;
			z-index: 1;
			transition: 0.3s;
		}

		.area-card:hover .area-title {
			color: #fff;
		}

		/* ── WHO SHOULD ATTEND ── */
		.tp-audience-section {
			padding: 70px 0;
			background: linear-gradient(135deg, #f8f9fc, #ffffff);
		}

		.audience-row {
			display: flex;
			flex-wrap: wrap;
			gap: 16px;
			margin-top: 36px;
			justify-content: center;
		}

		.audience-chip {
			display: flex;
			align-items: center;
			gap: 10px;
			background: #fff;
			border: 1px solid rgba(23, 34, 91, 0.1);
			border-radius: 50px;
			padding: 12px 22px;
			font-size: 0.95rem;
			font-weight: 600;
			color: var(--text);
			box-shadow: 0 6px 18px rgba(0, 0, 0, 0.05);
			transition: 0.28s;
		}

		.audience-chip i {
			color: var(--gold);
			font-size: 16px;
		}

		.audience-chip:hover {
			background: var(--navy);
			color: #fff;
			border-color: var(--navy);
			transform: translateY(-4px);
			box-shadow: 0 14px 28px rgba(23, 34, 91, 0.18);
		}

		.audience-chip:hover i {
			color: var(--gold);
		}

		/* ── CTA SECTION ── */
		.tp-cta-section {
			padding: 60px 0;
			background: #f1f5f9;
		}

		.tp-cta-box {
			background: var(--navy);
			padding: 50px 48px;
			border-radius: 28px;
			color: #fff;
			position: relative;
			overflow: hidden;
		}

		.tp-cta-box::before {
			content: '';
			position: absolute;
			width: 360px;
			height: 360px;
			background: rgba(177, 126, 57, 0.22);
			top: -100px;
			right: -100px;
			border-radius: 50%;
			filter: blur(90px);
		}

		.tp-cta-title {
			font-size: 1.9rem;
			font-weight: 700;
			color: #fff;
			margin-bottom: 10px;
		}

		.tp-cta-text {
			font-size: 1rem;
			color: #cbd5e1;
			line-height: 1.65;
			margin-bottom: 0;
		}

		.tp-cta-btn {
			display: inline-flex;
			align-items: center;
			gap: 10px;
			background: var(--gold);
			color: #fff;
			padding: 14px 28px;
			border-radius: 50px;
			font-weight: 700;
			font-size: 0.95rem;
			text-decoration: none;
			transition: all 0.3s ease;
			position: relative;
			z-index: 1;
		}

		.tp-cta-btn:hover {
			background: #fff;
			color: var(--navy);
			transform: translateY(-2px);
		}

		.tp-cta-btn:hover i {
			transform: translateX(5px);
		}

		.tp-cta-btn i {
			transition: 0.3s;
		}

		/* ── TAILORED NOTE ── */
		.tp-note-box {
			background: linear-gradient(135deg, var(--navy-light), rgba(177, 126, 57, 0.06));
			border: 1px dashed rgba(177, 126, 57, 0.4);
			border-radius: 18px;
			padding: 28px 32px;
			display: flex;
			align-items: center;
			gap: 18px;
			margin-top: 36px;
		}

		.tp-note-icon {
			width: 52px;
			height: 52px;
			background: #ecab23;
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			color: #fff;
			font-size: 20px;
			flex-shrink: 0;
		}

		.tp-note-text {
			font-size: 0.97rem;
			color: var(--text);
			font-weight: 500;
			line-height: 1.6;
		}

		.tp-note-text strong {
			color: var(--navy);
		}

		/* responsive */
		@media (max-width: 768px) {
			.tp-intro-card {
				padding: 32px 22px;
			}

			.tp-cta-box {
				padding: 36px 24px;
			}

			.tp-cta-title {
				font-size: 1.5rem;
			}

			.tp-section-heading {
				font-size: 1.7rem;
			}
		}