/* Elite Seminaire V2 — content blocks for Services / About / Contact */

/* sections */
.esc-content-section {
	padding: 64px 0 0;
}
.esc-content-section--soft {
	background: linear-gradient(180deg, #F8FAFC, #FFFFFF);
	/* Bleed out by exactly the page gutter so the soft band spans the wrapper
	   edge-to-edge without ever exceeding the viewport (fixed -24px overflowed
	   at 375px). Matches .esc-page's clamp(20px,4vw,56px) gutter. */
	margin: 56px calc(-1 * clamp(20px, 4vw, 56px)) 0;
	padding: 64px clamp(20px, 4vw, 56px);
	border-top: 1px solid #E2E8F0;
	border-bottom: 1px solid #E2E8F0;
}
.esc-content-section__header {
	text-align: center;
	max-width: 720px;
	margin: 0 auto 40px;
}
.esc-content-section__header h2 {
	margin: 6px 0 12px;
	font-size: clamp(24px, 3vw, 32px);
	letter-spacing: -0.02em;
}

/* Services pricing grid */
.esc-services-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.esc-services-grid--two { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 920px) { .esc-services-grid, .esc-services-grid--two { grid-template-columns: 1fr; } }

.esc-service {
	background: #FFFFFF;
	border: 1px solid #E2E8F0;
	border-radius: 18px;
	padding: 32px 28px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}
.esc-service--featured {
	border-color: #6366F1;
	box-shadow: 0 16px 40px rgb(99 102 241 / 18%);
	transform: translateY(-4px);
}
.esc-service__header h2 {
	margin: 12px 0 4px;
	font-size: 22px;
	color: #0F172A;
}
.esc-service__pill {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 999px;
	background: #EEF2FF;
	color: #4F46E5;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}
.esc-service__pill--featured { background: #6366F1; color: #FFFFFF; }
.esc-service__price {
	margin: 4px 0 0;
	color: #0F172A;
	font-weight: 600;
	font-size: 18px;
}
.esc-service__points {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
	flex: 1;
}
.esc-service__points li {
	padding-left: 24px;
	position: relative;
	color: #1F2937;
	font-size: 14.5px;
	line-height: 1.5;
}
.esc-service__points li::before {
	content: "✓";
	position: absolute;
	left: 0;
	top: 0;
	color: #16A34A;
	font-weight: 700;
}

/* Steps */
.esc-steps {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	counter-reset: steps;
}
@media (max-width: 920px) { .esc-steps { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .esc-steps { grid-template-columns: 1fr; } }
.esc-steps li {
	background: #FFFFFF;
	border: 1px solid #E2E8F0;
	border-radius: 14px;
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.esc-steps__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	background: linear-gradient(135deg, #6366F1, #4F46E5);
	color: #FFFFFF;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.04em;
}
.esc-steps li h3 { margin: 4px 0; font-size: 16px; color: #0F172A; }
.esc-steps li p { margin: 0; color: #475569; font-size: 14px; }

/* Audience grid */
.esc-audience-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
}
@media (max-width: 720px) { .esc-audience-grid { grid-template-columns: 1fr; } }
.esc-audience {
	background: #FFFFFF;
	border: 1px solid #E2E8F0;
	border-radius: 12px;
	padding: 18px 22px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.esc-audience strong { color: #0F172A; }
.esc-audience span { color: #64748B; font-size: 14px; }

/* About stats */
.esc-about-stats {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
	margin: 0;
}
@media (max-width: 720px) { .esc-about-stats { grid-template-columns: repeat(2, 1fr); } }
/* Below ~400px, two 32px numbers per row get cramped — stack to one column. */
@media (max-width: 400px) { .esc-about-stats { grid-template-columns: 1fr; } }
.esc-about-stats > div {
	background: #FFFFFF;
	border: 1px solid #E2E8F0;
	border-radius: 14px;
	padding: 24px;
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.esc-about-stats strong {
	font-size: 32px;
	letter-spacing: -0.02em;
	color: #0F172A;
	background: linear-gradient(135deg, #6366F1, #0EA5E9);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.esc-about-stats span { color: #64748B; font-size: 13px; }

/* Guarantees */
.esc-guarantees {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}
@media (max-width: 920px) { .esc-guarantees { grid-template-columns: 1fr; } }
.esc-guarantees > div {
	background: #FFFFFF;
	border: 1px solid #E2E8F0;
	border-radius: 12px;
	padding: 18px 20px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.esc-guarantees strong { color: #0F172A; font-size: 15px; }
.esc-guarantees span { color: #475569; font-size: 14px; line-height: 1.5; }

/* Contact grid */
.esc-contact-grid {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 32px;
	align-items: start;
}
@media (max-width: 920px) { .esc-contact-grid { grid-template-columns: 1fr; } }

.esc-contact-channels {
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.esc-contact-card {
	background: #FFFFFF;
	border: 1px solid #E2E8F0;
	border-radius: 14px;
	padding: 18px 20px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.esc-contact-card__icon {
	width: 40px; height: 40px;
	display: inline-flex;
	align-items: center; justify-content: center;
	border-radius: 10px;
	background: #EEF2FF;
	font-size: 20px;
	margin-bottom: 4px;
}
.esc-contact-card strong { color: #0F172A; font-size: 14px; }
.esc-contact-card a { color: #4F46E5 !important; font-weight: 500; }
.esc-contact-card small { color: #64748B; font-size: 12px; }

/* Contact form */
.esc-contact-form {
	background: #FFFFFF;
	border: 1px solid #E2E8F0;
	border-radius: 18px;
	padding: 32px;
	display: flex;
	flex-direction: column;
	gap: 18px;
	position: relative;
}
.esc-contact-form h2 { margin: 0; font-size: 22px; color: #0F172A; }
.esc-contact-form .esc-muted { margin: 0; }
.esc-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
@media (max-width: 600px) { .esc-form-row { grid-template-columns: 1fr; } }
.esc-contact-form label {
	display: flex;
	flex-direction: column;
	gap: 6px;
	font-size: 13px;
	color: #0F172A;
	font-weight: 600;
}
.esc-contact-form input,
.esc-contact-form select,
.esc-contact-form textarea {
	font: inherit;
	padding: 11px 14px;
	border: 1px solid #E2E8F0;
	border-radius: 10px;
	background: #F8FAFC;
	color: #0F172A;
	transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
	width: 100%;
	box-sizing: border-box;
	font-weight: 400;
	font-size: 14.5px;
}
.esc-contact-form input:focus,
.esc-contact-form select:focus,
.esc-contact-form textarea:focus {
	outline: none;
	border-color: #6366F1;
	background: #FFFFFF;
	box-shadow: 0 0 0 3px rgb(99 102 241 / 18%);
}
.esc-contact-form textarea { resize: vertical; min-height: 120px; }
.esc-contact-form button { align-self: flex-start; }
.esc-form-consent { margin: 0; color: #64748B; font-size: 12.5px; }

/* Status banners (?esc_contact=ok|invalid|fail|nonce) */
.esc-form-banner {
	padding: 14px 16px;
	border-radius: 12px;
	font-weight: 500;
	font-size: 14px;
}
.esc-form-banner--ok      { background: #DCFCE7; color: #166534; border: 1px solid #BBF7D0; }
.esc-form-banner--err     { background: #FEE2E2; color: #991B1B; border: 1px solid #FECACA; }