/*
 * EMTM Static Pages — About, Contact, Terms, Privacy
 *
 * Design rules (matches topic-page.css):
 * - Zero hardcoded colors. All colors from Foxiz CSS variables.
 * - Zero font declarations. All fonts from Foxiz CSS variables.
 * - Dark mode via [data-theme='dark'] overrides.
 *
 * Foxiz variables: --g-color, --body-fcolor, --meta-fcolor,
 * --solid-light, --solid-white, --flex-gray-15, --dark-accent,
 * --round-7, --h1-family, --h2-family, --body-family
 */

/* ════════════════════════════════════════════════════════════════════════════
   PAGE WRAPPER
   ════════════════════════════════════════════════════════════════════════════ */

.emt { max-width: 100%; overflow-x: hidden; }

/* ════════════════════════════════════════════════════════════════════════════
   SECTIONS
   ════════════════════════════════════════════════════════════════════════════ */

.emt-section         { padding: 72px 0; }
.emt-section--bordered { border-bottom: 1px solid var(--flex-gray-15); }
.emt-section--sm     { padding: 48px 0; }

/* ════════════════════════════════════════════════════════════════════════════
   CONTAINERS
   ════════════════════════════════════════════════════════════════════════════ */

.emt-container       { max-width: 1080px; margin: 0 auto; padding: 0 24px; }
.emt-container--narrow { max-width: 720px; margin: 0 auto; }

/* ════════════════════════════════════════════════════════════════════════════
   EYEBROW
   ════════════════════════════════════════════════════════════════════════════ */

.emt-eyebrow {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.13em;
	text-transform: uppercase;
	color: var(--g-color);
	display: block;
	margin-bottom: 14px;
}
.emt-eyebrow--mint { color: #2d8a4e; }

/* ════════════════════════════════════════════════════════════════════════════
   HEADLINES
   ════════════════════════════════════════════════════════════════════════════ */

.emt-headline {
	font-weight: 700;
	line-height: 1.22;
	color: var(--body-fcolor);
	font-family: var(--h2-family), var(--body-family), sans-serif;
	margin: 0 0 24px;
}
.emt-headline--hero {
	font-size: clamp(32px, 4.5vw, 48px);
	line-height: 1.15;
	font-family: var(--h1-family), var(--body-family), sans-serif;
	margin: 0 0 20px;
}
.emt-headline--section {
	font-size: clamp(24px, 3vw, 34px);
	margin: 0 0 32px;
}
.emt-headline em {
	font-style: italic;
	color: var(--g-color);
}

/* ════════════════════════════════════════════════════════════════════════════
   HERO
   ════════════════════════════════════════════════════════════════════════════ */

.emt-hero {
	padding: 96px 0 72px;
	background: var(--solid-white);
}
.emt-hero__inner {
	max-width: 1080px;
	margin: 0 auto;
	padding: 0 24px;
}

/* ════════════════════════════════════════════════════════════════════════════
   BODY TEXT
   ════════════════════════════════════════════════════════════════════════════ */

.emt-body {
	font-size: 16px;
	line-height: 1.78;
	color: var(--body-fcolor);
	margin: 0 0 16px;
}
.emt-body--lg   { font-size: 18px; }
.emt-body--muted { color: var(--meta-fcolor); }

/* ════════════════════════════════════════════════════════════════════════════
   CALLOUT BOX
   ════════════════════════════════════════════════════════════════════════════ */

.emt-callout {
	background: var(--solid-light);
	border: 1px solid var(--flex-gray-15);
	border-left: 4px solid var(--g-color);
	border-radius: var(--round-7);
	padding: 24px 28px;
	font-size: 15px;
	line-height: 1.7;
	color: var(--body-fcolor);
	margin-top: 24px;
}
.emt-callout--mint {
	background: #edfff2;
	border-color: #c8f7d5;
	border-left-color: #2d8a4e;
}

/* ════════════════════════════════════════════════════════════════════════════
   TEAM GRID  (About page)
   ════════════════════════════════════════════════════════════════════════════ */

.emt-team-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	margin-top: 16px;
}

.emt-team-card {
	background: var(--solid-white);
	border: 1px solid var(--flex-gray-15);
	border-radius: var(--round-7);
	padding: 28px 24px;
	transition: box-shadow 0.18s, transform 0.15s;
}
.emt-team-card:hover {
	box-shadow: 0 8px 32px rgba(0,0,0,0.07);
	transform: translateY(-2px);
}
.emt-team-card--mint {
	background: #f8fff9;
	border-color: #d4f5dc;
}

.emt-team-card__header {
	display: flex;
	gap: 14px;
	align-items: center;
	margin-bottom: 16px;
}
.emt-team-card__avatar {
	width: 44px; height: 44px;
	border-radius: 50%;
	background: var(--solid-light);
	color: var(--g-color);
	font-size: 14px; font-weight: 700;
	display: flex; align-items: center; justify-content: center;
	flex-shrink: 0;
	border: 2px solid var(--flex-gray-15);
}
.emt-team-card__avatar--mint {
	background: #edfff2;
	border-color: #c8f7d5;
	color: #2d8a4e;
}
.emt-team-card__name {
	font-size: 15px; font-weight: 700;
	color: var(--body-fcolor); line-height: 1.3;
}
.emt-team-card__role {
	font-size: 12px; font-weight: 600;
	color: var(--g-color); line-height: 1.3;
}
.emt-team-card__location {
	font-size: 12px;
	color: var(--meta-fcolor); line-height: 1.3;
}
.emt-team-card__bio {
	font-size: 14px; line-height: 1.7;
	color: var(--meta-fcolor); margin: 0 0 12px;
}
.emt-team-card__credentials {
	font-size: 11px; line-height: 1.6;
	color: var(--meta-fcolor); opacity: 0.7;
	border-top: 1px solid var(--flex-gray-15);
	padding-top: 12px;
}

/* ════════════════════════════════════════════════════════════════════════════
   "WHAT THIS IS NOT" LIST  (About page)
   ════════════════════════════════════════════════════════════════════════════ */

.emt-about-notlist {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}
.emt-about-notlist__item {
	background: var(--solid-white);
	border: 1px solid var(--flex-gray-15);
	border-radius: var(--round-7);
	padding: 24px 20px;
}
.emt-about-notlist__label {
	font-size: 15px; font-weight: 700;
	color: var(--body-fcolor); margin-bottom: 8px;
}
.emt-about-notlist__text {
	font-size: 14px; line-height: 1.7;
	color: var(--meta-fcolor); margin: 0;
}

/* ════════════════════════════════════════════════════════════════════════════
   BUTTON
   ════════════════════════════════════════════════════════════════════════════ */

.emt-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	font-weight: 700;
	border-radius: var(--round-7);
	transition: background 0.18s, transform 0.1s, box-shadow 0.18s;
	white-space: nowrap;
}
.emt-btn--primary {
	background: var(--btn-primary);
	color: var(--btn-accent);
	font-size: 15px;
	padding: 14px 28px;
}
.emt-btn--primary:hover {
	background: var(--btn-primary-h);
	color: var(--btn-accent-h);
	transform: translateY(-1px);
	box-shadow: 0 8px 28px color-mix(in srgb, var(--btn-primary) 45%, transparent);
}
.emt-btn--lg {
	font-size: 17px;
	padding: 17px 40px;
}

/* ════════════════════════════════════════════════════════════════════════════
   CTA NOTE + TEXT UTILITIES
   ════════════════════════════════════════════════════════════════════════════ */

.emt-text-center { text-align: center; }
.emt-cta-note    { font-size: 13px; color: var(--meta-fcolor); margin: 0; }

.emt-mb-sm { margin-bottom: 8px; }
.emt-mb-md { margin-bottom: 20px; }
.emt-mb-lg { margin-bottom: 32px; }
.emt-mt-md { margin-top: 20px; }
.emt-mt-lg { margin-top: 32px; }

/* ════════════════════════════════════════════════════════════════════════════
   CONTACT PAGE — TWO-COLUMN LAYOUT
   ════════════════════════════════════════════════════════════════════════════ */

.emt-contact-layout {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	gap: 48px;
	align-items: start;
}

.emt-contact-reason       { margin-bottom: 28px; }
.emt-contact-reason:last-child { margin-bottom: 0; }
.emt-contact-reason__label {
	font-size: 15px; font-weight: 700;
	color: var(--body-fcolor); margin-bottom: 6px;
}
.emt-contact-reason__text {
	font-size: 14px; line-height: 1.7;
	color: var(--meta-fcolor); margin: 0;
}
.emt-contact-reason__text a {
	color: var(--g-color);
	text-decoration: underline;
}

.emt-contact-privacy {
	font-size: 12px;
	color: var(--meta-fcolor);
	margin-top: 24px;
	padding-top: 16px;
	border-top: 1px solid var(--flex-gray-15);
}

/* ════════════════════════════════════════════════════════════════════════════
   STATS ROW
   ════════════════════════════════════════════════════════════════════════════ */

.emt-stats-row {
	display: flex;
	justify-content: center;
	gap: 64px;
}
.emt-stat {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
}
.emt-stat__num {
	font-size: clamp(32px, 4vw, 48px);
	font-weight: 800;
	color: var(--body-fcolor);
	line-height: 1;
	font-family: var(--h1-family), var(--body-family), sans-serif;
}
.emt-stat__label {
	font-size: 13px; font-weight: 600;
	color: var(--meta-fcolor); text-align: center;
}

/* ════════════════════════════════════════════════════════════════════════════
   LEGAL PAGES — Terms & Privacy content
   ════════════════════════════════════════════════════════════════════════════ */

.emt-legal-content { max-width: 720px; margin: 0 auto; }

.emt-legal-content h2 {
	font-size: 20px; font-weight: 700;
	color: var(--body-fcolor);
	margin: 40px 0 16px;
	font-family: var(--h2-family), var(--body-family), sans-serif;
}
.emt-legal-content p {
	font-size: 15px; line-height: 1.78;
	color: var(--meta-fcolor); margin: 0 0 16px;
}
.emt-legal-content p:last-child { margin-bottom: 0; }
.emt-legal-content a {
	color: var(--g-color);
	text-decoration: underline;
}

.emt-legal-callout {
	background: var(--solid-light);
	border: 1px solid var(--flex-gray-15);
	border-left: 4px solid var(--g-color);
	border-radius: var(--round-7);
	padding: 20px 24px;
	font-size: 14px; line-height: 1.7;
	color: var(--body-fcolor);
	margin-bottom: 32px;
}

.emt-legal-item {
	margin-bottom: 20px;
	padding-left: 16px;
	border-left: 3px solid var(--flex-gray-15);
}
.emt-legal-item__label {
	font-size: 15px; font-weight: 700;
	color: var(--body-fcolor); margin-bottom: 4px;
}
.emt-legal-item__text {
	font-size: 14px; line-height: 1.7;
	color: var(--meta-fcolor); margin: 0;
}

/* ════════════════════════════════════════════════════════════════════════════
   FINAL CTA SECTION (dark band)
   ════════════════════════════════════════════════════════════════════════════ */

.emt-section--cta {
	background: #0d1117;
	padding: 80px 0;
	text-align: center;
}
.emt-section--cta .emt-headline     { color: #fff; }
.emt-section--cta .emt-headline em  { color: #B7FDC6; }
.emt-section--cta .emt-body--muted  { color: rgba(255,255,255,0.65); }
.emt-section--cta .emt-cta-note     { color: rgba(255,255,255,0.40); }

/* ════════════════════════════════════════════════════════════════════════════
   SCROLL REVEAL ANIMATION
   ════════════════════════════════════════════════════════════════════════════ */

.emt-reveal {
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}
.emt-reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.emt-anim-1 { transition-delay: 0.08s; }
.emt-anim-2 { transition-delay: 0.16s; }
.emt-anim-3 { transition-delay: 0.24s; }

/* ════════════════════════════════════════════════════════════════════════════
   DARK MODE
   ════════════════════════════════════════════════════════════════════════════ */

/* Sections */
[data-theme='dark'] .emt-hero              { background: var(--dark-accent); }
[data-theme='dark'] .emt-section--bordered { border-color: #2a2a2a; }
[data-theme='dark'] .emt-section--cta      { background: #080c12; }

/* Text */
[data-theme='dark'] .emt-headline       { color: #fff; }
[data-theme='dark'] .emt-headline em    { color: var(--g-color); }
[data-theme='dark'] .emt-body           { color: rgba(255,255,255,0.80); }
[data-theme='dark'] .emt-body--muted    { color: rgba(255,255,255,0.55); }
[data-theme='dark'] .emt-eyebrow--mint  { color: #4ade80; }

/* Callouts */
[data-theme='dark'] .emt-callout {
	background: rgba(255,255,255,0.04);
	border-color: #2a2a2a;
}
[data-theme='dark'] .emt-callout--mint {
	background: #0f1f18;
	border-color: #1a3a28;
}

/* Team cards */
[data-theme='dark'] .emt-team-card {
	background: var(--dark-accent);
	border-color: #2a2a2a;
}
[data-theme='dark'] .emt-team-card--mint {
	background: #0f1f18;
	border-color: #1a3a28;
}
[data-theme='dark'] .emt-team-card__avatar {
	background: rgba(255,255,255,0.08);
	border-color: #333;
}
[data-theme='dark'] .emt-team-card__name { color: #fff; }
[data-theme='dark'] .emt-team-card__bio  { color: rgba(255,255,255,0.60); }
[data-theme='dark'] .emt-team-card__credentials {
	color: rgba(255,255,255,0.40);
	border-color: #2a2a2a;
}

/* Not-list */
[data-theme='dark'] .emt-about-notlist__item {
	background: var(--dark-accent);
	border-color: #2a2a2a;
}
[data-theme='dark'] .emt-about-notlist__label { color: #fff; }
[data-theme='dark'] .emt-about-notlist__text  { color: rgba(255,255,255,0.60); }

/* Buttons */
[data-theme='dark'] .emt-btn--primary {
	background: var(--g-color);
	color: #fff;
}
[data-theme='dark'] .emt-btn--primary:hover {
	background: color-mix(in srgb, var(--g-color) 80%, #000);
	color: #fff;
	box-shadow: 0 8px 28px color-mix(in srgb, var(--g-color) 35%, transparent);
}

/* Stats */
[data-theme='dark'] .emt-stat__num   { color: #fff; }
[data-theme='dark'] .emt-stat__label { color: rgba(255,255,255,0.50); }

/* Legal */
[data-theme='dark'] .emt-legal-content h2 { color: #fff; }
[data-theme='dark'] .emt-legal-content p  { color: rgba(255,255,255,0.65); }
[data-theme='dark'] .emt-legal-callout {
	background: rgba(255,255,255,0.04);
	border-color: #2a2a2a;
}
[data-theme='dark'] .emt-legal-item       { border-color: #2a2a2a; }
[data-theme='dark'] .emt-legal-item__label { color: #fff; }
[data-theme='dark'] .emt-legal-item__text  { color: rgba(255,255,255,0.60); }

/* Contact */
[data-theme='dark'] .emt-contact-reason__label { color: #fff; }
[data-theme='dark'] .emt-contact-reason__text  { color: rgba(255,255,255,0.60); }
[data-theme='dark'] .emt-contact-privacy {
	border-color: #2a2a2a;
	color: rgba(255,255,255,0.40);
}

/* Skip animations in dark mode */
[data-theme='dark'] .emt-reveal {
	opacity: 1 !important;
	transform: none !important;
}

/* ════════════════════════════════════════════════════════════════════════════
   RESPONSIVE — TABLET (≤ 900px)
   ════════════════════════════════════════════════════════════════════════════ */

@media (max-width: 900px) {
	.emt-team-grid        { grid-template-columns: 1fr; }
	.emt-about-notlist    { grid-template-columns: 1fr; }
	.emt-contact-layout   { grid-template-columns: 1fr; gap: 32px; }
	.emt-stats-row        { gap: 40px; }
}

/* ════════════════════════════════════════════════════════════════════════════
   RESPONSIVE — MOBILE (≤ 640px)
   ════════════════════════════════════════════════════════════════════════════ */

@media (max-width: 640px) {
	.emt-hero             { padding: 56px 0 44px; }
	.emt-section          { padding: 48px 0; }
	.emt-headline--hero   { font-size: 28px; }
	.emt-headline--section { font-size: 22px; }
	.emt-stats-row        { flex-direction: column; gap: 24px; align-items: center; }
	.emt-btn--lg          { width: 100%; justify-content: center; }
	.emt-section--cta     { padding: 56px 0; }
}