/* iAccess — contact + privacy pagina styles (prose, page-hero, callouts) */

.page-hero {
	padding: 120px 24px 60px;
	background: var(--ink);
	position: relative;
	overflow: hidden;
}
.page-hero::before {
	content: '';
	position: absolute; inset: 0;
	background: radial-gradient(ellipse 60% 40% at 50% -10%, rgba(37,99,235,0.1) 0%, transparent 60%);
	pointer-events: none;
}
.page-hero-inner {
	max-width: 760px; margin: 0 auto;
	position: relative; z-index: 1;
}
.page-hero-label {
	font-size: 11px; font-weight: 700; letter-spacing: 2px;
	text-transform: uppercase; color: var(--blue-light);
	margin-bottom: 14px;
	display: flex; align-items: center; gap: 8px;
}
.page-hero-label::before {
	content: ''; width: 20px; height: 1px;
	background: var(--blue-light); opacity: 0.6; border-radius: 1px;
}
.page-hero h1 {
	font-family: var(--font-display);
	font-size: clamp(28px, 4vw, 48px);
	line-height: 1.1; letter-spacing: -1.5px;
	color: #fff; margin-bottom: 16px; font-weight: 400;
}
.page-hero h1 em { font-style: italic; color: var(--blue-light); }
.page-hero p {
	font-size: 17px; color: rgba(255,255,255,0.45); line-height: 1.7;
}

.page-content {
	padding: 0 24px 100px;
	background: var(--ink);
}
.page-inner {
	max-width: 760px; margin: 0 auto;
	padding-top: 48px;
}

.prose h2 {
	font-family: var(--font-display);
	font-size: 24px; color: #fff;
	margin: 44px 0 14px;
	font-weight: 400; letter-spacing: -0.5px;
}
.prose h2:first-child { margin-top: 0; }
.prose h3 {
	font-size: 16px; font-weight: 700;
	color: rgba(255,255,255,0.82);
	margin: 28px 0 10px;
}
.prose p {
	font-size: 15px; color: rgba(255,255,255,0.5);
	line-height: 1.82; margin-bottom: 16px;
}
.prose strong { color: rgba(255,255,255,0.8); font-weight: 600; }
.prose a {
	color: var(--blue-light); text-decoration: underline;
	text-underline-offset: 3px;
}
.prose ul,
.prose ol {
	margin: 0 0 16px 20px;
	font-size: 15px; color: rgba(255,255,255,0.5); line-height: 1.82;
}
.prose li { margin-bottom: 6px; }
.prose .date {
	font-size: 13px; color: rgba(255,255,255,0.22);
	margin-bottom: 32px; padding-bottom: 24px;
	border-bottom: 1px solid var(--edge);
}

.callout {
	border-radius: var(--radius);
	padding: 18px 20px; margin: 24px 0;
	display: flex; gap: 12px; align-items: flex-start;
}
.callout-info {
	background: rgba(37,99,235,0.08);
	border: 1px solid rgba(37,99,235,0.2);
}
.callout-icon {
	font-size: 18px; flex-shrink: 0; line-height: 1.5;
}
.callout-text {
	font-size: 14px; color: rgba(255,255,255,0.5); line-height: 1.65;
}
.callout-text strong {
	display: block; color: rgba(255,255,255,0.8); margin-bottom: 3px;
}

/* Contact page-specifieke blokken */
.contact-grid {
	display: grid; grid-template-columns: 1fr 1fr;
	gap: 24px; margin-bottom: 48px;
}
.contact-card {
	background: var(--surface-2);
	border: 1px solid var(--edge);
	border-radius: var(--radius);
	padding: 28px;
}
.contact-card-icon {
	width: 40px; height: 40px;
	border-radius: 10px;
	display: flex; align-items: center; justify-content: center;
	margin-bottom: 16px;
}
.contact-card-icon.blue {
	background: rgba(37,99,235,0.12);
	border: 1px solid rgba(37,99,235,0.25);
	color: var(--blue-light);
}
.contact-card-icon.green {
	background: rgba(5,150,105,0.12);
	border: 1px solid rgba(5,150,105,0.25);
	color: var(--green);
}
.contact-card h3 {
	font-size: 15px; font-weight: 700;
	color: rgba(255,255,255,0.82);
	margin-bottom: 6px;
}
.contact-card p {
	font-size: 14px; color: rgba(255,255,255,0.4);
	margin-bottom: 0; line-height: 1.5;
}
.contact-card p strong { color: rgba(255,255,255,0.7); }

.page-cta {
	margin-top: 40px; text-align: center;
}

@media (max-width: 768px) {
	.contact-grid { grid-template-columns: 1fr; }
}