/* ═══════════════════════════════════════════════
   PROJECT:  AEO Site Suite — AI Blog Writer Plugin
   FILE:     assets/css/blocks.css
   VERSION:  v1.23
   UPDATED:  2026-08-06 11:57 AM CT
   CHANGES:  Removed the .aeo-cs-faq-answer rule — FAQ answers are plain
             <p> now and use the theme's default paragraph style.
   ═══════════════════════════════════════════════ */

/* The Quick Answer — rounded light-blue box, solid blue border, lightbulb
   icon + text heading together (never color alone). Dark blue text on
   light blue: 4.5:1+ contrast. No italics. */

.aeo-cs-quick-answer-box {
	background: #dbeafe;
	border: 2px solid #1d4ed8;
	border-radius: 12px;
	padding: 20px 24px;
	margin: 0 0 28px;
}

.aeo-cs-quick-answer-heading {
	font-size: 20px;
	font-weight: 700;
	color: #1e3a8a;
	margin: 0 0 10px;
}

.aeo-cs-quick-answer-text {
	font-size: 18px;
	line-height: 1.6;
	color: #1e3a8a;
	margin: 0;
}

/* FAQ section — H2 heading, bold H3 questions, always-visible answers
   (no accordion: hidden answers are worthless to AI crawlers). */

.aeo-cs-faq-section {
	margin: 28px 0 0;
}

.aeo-cs-faq-question {
	font-size: 20px;
	font-weight: 700;
	margin: 22px 0 8px;
}

/* FAQ answers intentionally have no plugin class/styles (v1.23) — they
   render as plain <p> and inherit the theme's default paragraph style. */

/* Highlight Quote — styled after the owner's reference image: plain
   background, a large black opening mark top-left with a thin rule to its
   right, large centered text, then a thin rule and a large black closing
   mark bottom-right. The giant marks ARE the quotation marks.
   Italic here is an owner-requested exception (2026-08-06) to the house
   no-italics rule — it applies to this quote text ONLY. */

.aeo-cs-quote-box {
	background: transparent;
	border: none;
	padding: 0;
	margin: 36px 0;
}

.aeo-cs-quote-top,
.aeo-cs-quote-bottom {
	display: flex;
	align-items: center;
	gap: 18px;
}

.aeo-cs-quote-top {
	margin-right: 8%;
}

.aeo-cs-quote-bottom {
	margin-left: 8%;
}

.aeo-cs-quote-mark {
	font-size: 72px;
	line-height: 0.55;
	font-weight: 700;
	color: #111827;
	flex-shrink: 0;
}

.aeo-cs-quote-top .aeo-cs-quote-mark {
	align-self: flex-start;
}

.aeo-cs-quote-bottom .aeo-cs-quote-mark {
	align-self: flex-end;
}

.aeo-cs-quote-line {
	flex-grow: 1;
	height: 2px;
	background: #111827;
}

.aeo-cs-quote-text {
	margin: 18px 0;
	padding: 0 24px;
	border: none;
	text-align: center;
}

.aeo-cs-quote-text p {
	font-size: 36px;
	line-height: 1.45;
	font-weight: 500;
	font-style: italic;
	color: #111827;
	margin: 0;
}

/* Tablet and mobile: smaller quote text (36px is a desktop size). */
@media (max-width: 1024px) {
	.aeo-cs-quote-text p {
		font-size: 26px;
	}
}

/* Image captions (generated posts add a figcaption below each in-content
   image). 18px minimum and NEVER italic — many themes default captions to
   small italic text, which violates both accessibility rules. */

.wp-block-image figcaption,
.wp-element-caption {
	font-size: 18px;
	font-style: normal;
	line-height: 1.5;
	color: #374151;
	margin: 8px 0 0;
}
