/* =====================================================================
 * Faragiri — E-E-A-T page suite (Contact + legal/trust pages).
 * Layers on the .fab base from about.css (enqueued first as a dependency
 * by mu-plugin faragiri-eeat.php). Adds: contact methods, working form,
 * address card, legal doc layout + TOC + prose, notice boxes, team
 * cards, testimonial cards, numbered steps, "updated" badge.
 * RTL, dark/glass brand aesthetic, scoped under .fab.
 * ===================================================================== */

/* ---- "last updated" badge ---- */
.fab__updated {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	margin-block-start: 1rem;
	padding: .34rem .9rem;
	border-radius: 999px;
	border: 1px solid var(--fg-line);
	background: var(--fg-surface);
	color: #b9c2d4;
	font-size: .82rem;
	font-weight: 700;
}
.fab__updated::before {
	content: "";
	inline-size: .5rem;
	block-size: .5rem;
	border-radius: 50%;
	background: #6BCD94;
	box-shadow: 0 0 0 4px rgba(107, 205, 148, .18);
}

/* =====================================================================
 * CONTACT — method cards
 * ===================================================================== */
.fab__contact-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: .9rem;
	margin-block-start: 1.3rem;
}
.fab__cmethod {
	display: flex;
	gap: .9rem;
	align-items: flex-start;
	padding: 1.3rem;
	border: 1px solid var(--fg-line);
	border-radius: 16px;
	background: var(--fg-surface-2);
	transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.fab__cmethod:hover {
	transform: translateY(-3px);
	border-color: rgba(83, 145, 228, .5);
	box-shadow: 0 18px 40px -24px rgba(83, 145, 228, .8);
}
.fab__cmethod-ic {
	flex: 0 0 auto;
	inline-size: 2.7rem;
	block-size: 2.7rem;
	border-radius: 12px;
	display: grid;
	place-items: center;
	font-size: 1.35rem;
	background: linear-gradient(135deg, rgba(141, 101, 233, .26), rgba(36, 186, 239, .2));
	border: 1px solid rgba(83, 145, 228, .35);
}
.fab__cmethod-label { color: var(--fg-muted); font-size: .85rem; font-weight: 600; margin-block-end: .25rem; }
.fab__cmethod-val { color: #fff; font-size: 1.02rem; font-weight: 800; word-break: break-word; }
.fab__cmethod-val a { color: #fff; }
.fab__cmethod-val a:hover { color: var(--fg-accent); }
.fab__cmethod-sub { color: #aab3c6; font-size: .85rem; margin-block-start: .2rem; font-weight: 500; }
.fab__cmethod-val bdi { unicode-bidi: isolate; }

/* split: form + side info */
.fab__split {
	display: grid;
	grid-template-columns: 1.3fr .9fr;
	gap: 1.1rem;
	align-items: start;
	margin-block-start: 1.3rem;
}
@media (max-width: 880px) { .fab__split { grid-template-columns: 1fr; } }

/* address / hours card */
.fab__address { display: flex; flex-direction: column; gap: 1rem; }
.fab__address-row { display: flex; gap: .7rem; align-items: flex-start; }
.fab__address-row .fab__cmethod-ic { inline-size: 2.3rem; block-size: 2.3rem; font-size: 1.15rem; }
.fab__maplink {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	margin-block-start: .2rem;
	font-size: .85rem;
	font-weight: 700;
	color: var(--fg-accent);
}
.fab__maplink:hover { color: #fff; }
.fab__hours { display: flex; flex-direction: column; gap: .5rem; }
.fab__hours-row {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding-block: .35rem;
	border-block-end: 1px dashed var(--fg-line);
	color: #c1c9d9;
	font-size: .92rem;
}
.fab__hours-row:last-child { border-block-end: 0; }
.fab__hours-row strong { color: #fff; font-weight: 700; }

/* =====================================================================
 * WORKING FORM (REST-backed)
 * ===================================================================== */
.fab__form { display: flex; flex-direction: column; gap: 1rem; }
.fab__form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1rem;
}
@media (max-width: 560px) { .fab__form-grid { grid-template-columns: 1fr; } }
.fab__field { display: flex; flex-direction: column; gap: .4rem; }
.fab__field--full { grid-column: 1 / -1; }
.fab__label { font-size: .9rem; font-weight: 700; color: #dbe2f0; }
.fab__label span { color: #6BCD94; }
.fab__input,
.fab__textarea,
.fab__select {
	inline-size: 100%;
	padding: .8rem 1rem;
	border-radius: 12px;
	border: 1px solid var(--fg-line);
	background: rgba(13, 17, 26, .6);
	color: var(--fg-ink);
	font: inherit;
	font-size: .96rem;
	line-height: 1.7;
	transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.fab__textarea { min-block-size: 140px; resize: vertical; }
.fab__input::placeholder, .fab__textarea::placeholder { color: #6f7990; }
.fab__input:focus,
.fab__textarea:focus,
.fab__select:focus {
	outline: none;
	border-color: rgba(83, 145, 228, .65);
	box-shadow: 0 0 0 3px rgba(83, 145, 228, .18);
	background: rgba(13, 17, 26, .85);
}
.fab__input:user-invalid, .fab__textarea:user-invalid { border-color: rgba(239, 89, 108, .6); }
/* honeypot — visually & a11y hidden, kept in DOM for bots */
.fab__hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.fab__form-submit { align-self: flex-start; cursor: pointer; border: none; }
.fab__form-submit[disabled] { opacity: .6; cursor: progress; }
.fab__form-note { color: var(--fg-muted); font-size: .82rem; }
.fab__form-msg {
	display: none;
	padding: .9rem 1.1rem;
	border-radius: 12px;
	font-size: .95rem;
	font-weight: 600;
	line-height: 1.8;
}
.fab__form-msg.is-on { display: block; }
.fab__form-msg.is-ok { background: rgba(107, 205, 148, .14); border: 1px solid rgba(107, 205, 148, .45); color: #c7f0d8; }
.fab__form-msg.is-err { background: rgba(239, 89, 108, .12); border: 1px solid rgba(239, 89, 108, .45); color: #f3c2cb; }

/* =====================================================================
 * LEGAL / DOC LAYOUT — sticky TOC + prose
 * ===================================================================== */
.fab__doc {
	display: grid;
	grid-template-columns: 250px 1fr;
	gap: 1.4rem;
	align-items: start;
	margin-block-start: 1.5rem;
}
@media (max-width: 900px) { .fab__doc { grid-template-columns: 1fr; } }

.fab__toc {
	position: sticky;
	inset-block-start: 90px;
	padding: 1.2rem;
	border: 1px solid var(--fg-line);
	border-radius: 16px;
	background: var(--fg-surface-2);
	backdrop-filter: blur(6px);
}
@media (max-width: 900px) { .fab__toc { position: static; } }
.fab__toc-title {
	font-size: .82rem;
	font-weight: 800;
	letter-spacing: .03em;
	color: var(--fg-muted);
	text-transform: uppercase;
	margin-block-end: .8rem;
}
.fab__toc ol { list-style: none; counter-reset: toc; display: flex; flex-direction: column; gap: .15rem; }
.fab__toc li { counter-increment: toc; }
.fab__toc a {
	display: flex;
	gap: .55rem;
	align-items: baseline;
	padding: .5rem .6rem;
	border-radius: 9px;
	color: #c1c9d9;
	font-size: .9rem;
	font-weight: 600;
	transition: background .16s ease, color .16s ease;
}
.fab__toc a::before { content: counter(toc); color: var(--fg-accent); font-weight: 800; font-size: .82rem; }
.fab__toc a:hover { background: var(--fg-surface); color: #fff; }

/* prose / rich legal text */
.fab__prose { color: #c7cedd; font-size: 1rem; line-height: 2; }
.fab__prose > section { scroll-margin-top: 90px; }
.fab__prose > section + section { margin-block-start: 2.2rem; }
.fab__prose h2 {
	display: flex;
	align-items: center;
	gap: .7rem;
	font-size: clamp(1.2rem, 2.6vw, 1.55rem);
	font-weight: 800;
	color: var(--fg-ink);
	margin-block-end: .9rem;
	line-height: 1.5;
}
.fab__prose h2::before {
	content: "";
	flex: 0 0 auto;
	inline-size: .3rem;
	block-size: 1.25rem;
	border-radius: 999px;
	background: var(--fg-grad);
}
.fab__prose h3 { font-size: 1.08rem; font-weight: 800; color: #eaeefb; margin-block: 1.2rem .5rem; }
.fab__prose p { margin-block-end: 1rem; }
.fab__prose p:last-child { margin-block-end: 0; }
.fab__prose a { color: var(--fg-accent); font-weight: 600; }
.fab__prose a:hover { color: #fff; text-decoration: underline; }
.fab__prose strong { color: #fff; font-weight: 800; }
.fab__prose ul, .fab__prose ol { margin: 0 0 1rem; padding-inline-start: 1.4rem; display: flex; flex-direction: column; gap: .5rem; }
.fab__prose ul { list-style: none; padding-inline-start: 0; }
.fab__prose ul li { position: relative; padding-inline-start: 1.5rem; }
.fab__prose ul li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	inset-block-start: .65rem;
	inline-size: .5rem;
	block-size: .5rem;
	border-radius: 50%;
	background: var(--fg-grad);
}
.fab__prose ol { list-style: decimal; }
.fab__prose ol li::marker { color: var(--fg-accent); font-weight: 800; }
.fab__prose table {
	inline-size: 100%;
	border-collapse: collapse;
	margin-block: 1rem;
	font-size: .92rem;
	overflow: hidden;
	border-radius: 12px;
	border: 1px solid var(--fg-line);
}
.fab__prose th, .fab__prose td {
	padding: .75rem .9rem;
	border-block-end: 1px solid var(--fg-line);
	text-align: start;
}
.fab__prose th { background: rgba(83, 145, 228, .12); color: #fff; font-weight: 800; }
.fab__prose tr:last-child td { border-block-end: 0; }

/* notice / callout boxes */
.fab__note {
	display: flex;
	gap: .8rem;
	padding: 1rem 1.15rem;
	border-radius: 12px;
	border: 1px solid var(--fg-line);
	background: var(--fg-surface-2);
	margin-block: 1.1rem;
	color: #c7cedd;
	font-size: .95rem;
	line-height: 1.9;
}
.fab__note-ic { flex: 0 0 auto; font-size: 1.2rem; }
.fab__note--info { border-color: rgba(36, 186, 239, .4); background: rgba(36, 186, 239, .08); }
.fab__note--warn { border-color: rgba(240, 185, 90, .42); background: rgba(240, 185, 90, .08); }
.fab__note--ok { border-color: rgba(107, 205, 148, .42); background: rgba(107, 205, 148, .08); }
.fab__note strong { color: #fff; }

/* =====================================================================
 * NUMBERED STEPS (process / how-to)
 * ===================================================================== */
.fab__steps { display: flex; flex-direction: column; gap: .8rem; counter-reset: step; margin-block-start: 1.2rem; }
.fab__step {
	position: relative;
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	padding: 1.1rem 1.2rem;
	border: 1px solid var(--fg-line);
	border-radius: 14px;
	background: var(--fg-surface-2);
	counter-increment: step;
}
.fab__step::before {
	content: counter(step);
	flex: 0 0 auto;
	inline-size: 2.2rem;
	block-size: 2.2rem;
	border-radius: 10px;
	display: grid;
	place-items: center;
	font-weight: 900;
	font-size: 1.05rem;
	color: #0e121b;
	background: var(--fg-grad);
}
.fab__step-title { font-weight: 800; color: #fff; margin-block-end: .25rem; }
.fab__step-text { color: #b9c2d4; font-size: .95rem; line-height: 1.85; }

/* =====================================================================
 * TEAM
 * ===================================================================== */
.fab__team-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 1rem;
	margin-block-start: 1.3rem;
}
.fab__member {
	padding: 1.4rem;
	border: 1px solid var(--fg-line);
	border-radius: 16px;
	background: var(--fg-surface-2);
	transition: transform .18s ease, border-color .18s ease;
}
.fab__member:hover { transform: translateY(-3px); border-color: rgba(141, 101, 233, .5); }
.fab__member-top { display: flex; gap: .9rem; align-items: center; margin-block-end: .9rem; }
.fab__member-avatar {
	flex: 0 0 auto;
	inline-size: 3.2rem;
	block-size: 3.2rem;
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-size: 1.4rem;
	font-weight: 900;
	color: #fff;
	background: linear-gradient(135deg, rgba(141, 101, 233, .5), rgba(36, 186, 239, .42));
	border: 1px solid rgba(83, 145, 228, .45);
}
.fab__member-name { font-size: 1.08rem; font-weight: 800; color: #fff; }
.fab__member-role { color: var(--fg-accent); font-size: .85rem; font-weight: 700; margin-block-start: .15rem; }
.fab__member-bio { color: #b9c2d4; font-size: .94rem; line-height: 1.85; }

/* =====================================================================
 * TESTIMONIALS / QUOTES
 * ===================================================================== */
.fab__quotes {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 1rem;
	margin-block-start: 1.3rem;
}
.fab__quote {
	position: relative;
	padding: 1.5rem 1.4rem 1.3rem;
	border: 1px solid var(--fg-line);
	border-radius: 16px;
	background: var(--fg-surface-2);
	transition: transform .18s ease, border-color .18s ease;
}
.fab__quote:hover { transform: translateY(-3px); border-color: rgba(36, 186, 239, .5); }
.fab__quote::before {
	content: "\201D";
	position: absolute;
	inset-block-start: .2rem;
	inset-inline-end: 1rem;
	font-size: 3.2rem;
	line-height: 1;
	font-family: Georgia, serif;
	color: rgba(83, 145, 228, .3);
}
.fab__quote-stars { color: #f0c14b; font-size: .95rem; letter-spacing: .1em; margin-block-end: .6rem; }
.fab__quote-text { color: #d3dae8; font-size: .98rem; line-height: 1.9; margin-block-end: .9rem; }
.fab__quote-by { display: flex; align-items: center; gap: .6rem; }
.fab__quote-ava {
	inline-size: 2.1rem; block-size: 2.1rem; border-radius: 50%;
	display: grid; place-items: center; font-weight: 800; color: #fff; font-size: .9rem;
	background: linear-gradient(135deg, rgba(141, 101, 233, .5), rgba(36, 186, 239, .42));
}
.fab__quote-meta b { color: #fff; font-weight: 800; font-size: .92rem; display: block; }
.fab__quote-meta span { color: var(--fg-muted); font-size: .8rem; }

/* honors / awards row */
.fab__honors { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .8rem; margin-block-start: 1.3rem; }
.fab__honor {
	padding: 1.2rem; text-align: center;
	border: 1px solid var(--fg-line); border-radius: 14px; background: var(--fg-surface-2);
}
.fab__honor-ic { font-size: 1.7rem; }
.fab__honor-title { font-weight: 800; color: #fff; margin-block: .5rem .25rem; font-size: 1rem; }
.fab__honor-text { color: var(--fg-muted); font-size: .86rem; line-height: 1.7; }

@media (prefers-reduced-motion: reduce) {
	.fab__cmethod, .fab__member, .fab__quote, .fab__step { transition: none !important; }
}