/* หน้าแท็ก (tag.php) — เนื้อหาแบบตอบคำถาม สำหรับ SEO / AI Search */
.tag-page {
	padding: 50px 0 70px;
	background: linear-gradient(180deg, #FFF 0%, #f6f6f6 100%);
}

.tag-page .container { max-width: 980px; }

.tag-head {
	margin-bottom: 26px;
	text-align: center;
}

.tag-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 16px;
	border-radius: 999px;
	background: #fdecec;
	color: #CE0001;
	font-size: 14px;
	font-weight: 600;
}

.tag-title {
	margin: 14px 0 6px;
	font-size: 38px;
	font-weight: 700;
	line-height: 1.3;
	color: #1f1f1f;
}

.tag-page .tag-sub {
	font-size: 17px;
	color: #666 !important;
}

.tag-h2 {
	position: relative;
	margin: 40px 0 16px;
	padding-left: 14px;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.4;
	color: #1f1f1f;
}

.tag-h2::before {
	content: "";
	position: absolute;
	left: 0;
	top: 5px;
	bottom: 5px;
	width: 4px;
	border-radius: 4px;
	background: #CE0001;
}

/* ---------- คำตอบโดยสรุป ---------- */
.aeo-answer {
	position: relative;
	padding: 24px 28px;
	border-radius: 22px;
	background: linear-gradient(135deg, #fff6f6 0%, #FFF 100%);
	border: 1px solid #f3d6d6;
	box-shadow: 0 18px 40px rgba(120, 0, 0, .07);
}

.aeo-answer::before {
	content: "";
	position: absolute;
	left: 0;
	top: 22px;
	bottom: 22px;
	width: 5px;
	border-radius: 0 5px 5px 0;
	background: linear-gradient(180deg, #CE0001 0%, #8D0104 100%);
}

.aeo-label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 8px;
	font-size: 14px;
	font-weight: 700;
	color: #CE0001;
}

.tag-page .aeo-answer p {
	font-size: 18px;
	line-height: 1.9 !important;
	color: #2b2b2b !important;
}

.aeo-answer a { color: #CE0001; font-weight: 700; }

/* ---------- ข้อมูลสำคัญ ---------- */
.aeo-facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
	gap: 12px;
}

.aeo-fact {
	display: flex;
	align-items: flex-start;
	gap: 14px;
	padding: 16px 18px;
	border-radius: 16px;
	background: #FFF;
	border: 1px solid #eee;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .04);
}

.aeo-fact > i {
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 12px;
	background: #fdecec;
	color: #CE0001;
	font-size: 17px;
}

.aeo-fact small {
	display: block;
	font-size: 13px;
	color: #888;
}

.aeo-fact strong {
	display: block;
	font-size: 17px;
	line-height: 1.5;
	color: #1f1f1f;
}

.aeo-fact strong.aeo-fact-addr {
	font-size: 15px;
	font-weight: 600;
}

.aeo-fact strong a { color: #CE0001; }

.aeo-fact span {
	display: block;
	font-size: 13px;
	color: #888;
}

/* ---------- ตารางราคา ---------- */
.aeo-table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	border: 1px solid #eee;
	border-radius: 16px;
	background: #FFF;
	font-size: 16px;
}

.aeo-table th,
.aeo-table td {
	padding: 14px 18px;
	border-bottom: 1px solid #f0f0f0;
}

.aeo-table th {
	background: #fafafa;
	color: #555;
	font-weight: 700;
}

.aeo-table tr:last-child td { border-bottom: 0; }

.aeo-table td strong {
	font-size: 20px;
	color: #CE0001;
}

.tag-page .aeo-note {
	margin-top: 10px !important;
	font-size: 14px;
	color: #777 !important;
}

.aeo-note i { color: #CE0001; margin-right: 4px; }

/* ---------- บริการ ---------- */
.aeo-services {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 10px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.aeo-services li {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 16px;
	border-radius: 14px;
	background: #FFF;
	border: 1px solid #eee;
	font-size: 16px;
	color: #333;
}

.aeo-services i {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: #e8f7ee;
	color: #16a34a;
	font-size: 12px;
}

/* ---------- FAQ ---------- */
.aeo-faq {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.aeo-faq-item {
	border-radius: 16px;
	background: #FFF;
	border: 1px solid #eee;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .04);
	overflow: hidden;
}

.aeo-faq-item summary {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 52px 16px 18px;
	position: relative;
	list-style: none;
	cursor: pointer;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.5;
	color: #1f1f1f;
}

.aeo-faq-item summary::-webkit-details-marker { display: none; }

.aeo-faq-item summary > i {
	flex: none;
	color: #CE0001;
	font-size: 18px;
}

/* ลูกศรเปิด/ปิด */
.aeo-faq-item summary::after {
	content: "\f078";
	position: absolute;
	right: 20px;
	top: 50%;
	font-family: "Font Awesome 6 Free";
	font-weight: 900;
	font-size: 13px;
	color: #999;
	transform: translateY(-50%);
	transition: transform .25s ease;
}

.aeo-faq-item[open] summary::after { transform: translateY(-50%) rotate(180deg); }
.aeo-faq-item[open] { border-color: #f3d6d6; }
.aeo-faq-item summary:hover { background: #fffafa; }

.aeo-faq-item summary:focus-visible {
	outline: 3px solid #ffb400;
	outline-offset: -3px;
}

.aeo-faq-a {
	padding: 0 22px 18px 48px;
	font-size: 16px;
	line-height: 1.85;
	color: #444;
}

/* ---------- เกี่ยวกับ / ชวนติดต่อ / แท็กที่เกี่ยวข้อง ---------- */
.tag-page .tag-about p {
	margin-bottom: 10px !important;
	font-size: 16px;
	line-height: 1.85 !important;
	color: #444 !important;
}

.tag-cta {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 20px;
	align-items: center;
	margin-top: 36px;
	padding: 24px 26px;
	border-radius: 22px;
	background: #FFF;
	border: 1px solid #f3d6d6;
	box-shadow: 0 18px 40px rgba(120, 0, 0, .07);
}

.tag-cta-text strong {
	display: block;
	font-size: 22px;
	color: #1f1f1f;
}

.tag-cta-text span {
	font-size: 15px;
	color: #777;
}

.tag-cta .cbtn-group { margin: 0; }

.tag-related {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.tag-related a {
	padding: 8px 14px;
	border-radius: 999px;
	background: #FFF;
	border: 1px solid #e6e6e6;
	color: #444 !important;
	font-size: 14px;
	text-decoration: none !important;
	transition: background .2s ease, border-color .2s ease, color .2s ease;
}

.tag-related a:hover {
	background: #CE0001;
	border-color: #CE0001;
	color: #FFF !important;
}

@media (prefers-reduced-motion: reduce) {
	.aeo-faq-item summary::after, .tag-related a { transition: none; }
}

@media (max-width: 767px) {
	.tag-page { padding: 34px 0 50px; }
	.tag-title { font-size: 30px; }
	.tag-h2 { font-size: 21px; margin-top: 32px; }
	.aeo-answer { padding: 20px 18px 20px 22px; }
	.tag-page .aeo-answer p { font-size: 16px; }
	.aeo-faq-item summary { font-size: 16px; padding: 14px 46px 14px 14px; }
	.aeo-faq-a { padding: 0 16px 16px 16px; }
	.tag-cta { grid-template-columns: 1fr; }
}