/*
 * site39 - than bai.
 *
 * Nuoc di rieng cua site nay: moi muc h2 la mot tam PHIEU.
 *
 *   nhan chu hoa nho  ->  duong ke DOI  ->  chu cai dau cao hai dong
 *
 * Chu cai dau duoc phong to bang `::first-letter`, KHONG phai bang cach cat ky
 * tu dau ra mot the rieng: cat chuoi thi "The" thanh "T" + "he", hai tu khac
 * nhau duoi mat bo soat mat chu va trinh doc man hinh cung doc thanh hai manh.
 */

/* ---------------------------------------------------------------- */
/* Muc luc dau bai                                                   */
/* ---------------------------------------------------------------- */

.rc-index { margin: 34px 0 6px; }
.rc-index ol {
	list-style: none;
	margin: 0;
	padding: 0;
	counter-reset: rc-idx;
}
.rc-index li {
	counter-increment: rc-idx;
	padding: 7px 0;
	border-bottom: 1px solid var(--line);
	font-size: 14.5px;
	line-height: 1.45;
}
.rc-index li::before {
	content: counter(rc-idx, decimal-leading-zero);
	display: inline-block;
	width: 2.4em;
	font-family: var(--display);
	font-size: 12.5px;
	color: var(--accent);
}
.rc-index a { text-decoration: none; }
.rc-index a:hover { color: var(--accent); }

/* ---------------------------------------------------------------- */
/* Loi dan                                                          */
/* ---------------------------------------------------------------- */

.rc-headnote { margin: 0 0 12px; }

/* ---------------------------------------------------------------- */
/* Mot tam phieu                                                     */
/* ---------------------------------------------------------------- */

.rc-card { margin: 52px 0; }
.rc-card > .rc-card-label { margin-bottom: 9px; }
.rc-card > .rc-card-rule { margin-bottom: 16px; }

.rc-card-label {
	font-family: var(--text);
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--muted);
	margin: 0;
}
.rc-card--product > .rc-card-label { color: var(--accent); }

.rc-card-rule {
	height: 4px;
	border-top: 1px solid var(--ink);
	border-bottom: 1px solid var(--ink);
	margin: 0;
}

.rc-card-title {
	font-family: var(--display);
	font-weight: 500;
	font-size: clamp(23px, 4.2vw, 29px);
	line-height: 1.22;
	margin: 0 0 12px;
}

.rc-card-stats {
	margin: 0 0 20px;
	font-size: 12px;
	letter-spacing: 0.06em;
	color: var(--muted);
}
.rc-card-score {
	font-family: var(--display);
	font-size: 17px;
	color: var(--ink);
	letter-spacing: 0;
}
.rc-card-score-say { text-transform: uppercase; letter-spacing: 0.13em; }
.rc-card-price { font-family: var(--display); font-size: 17px; color: var(--ink); letter-spacing: 0; }
.rc-card-was { color: var(--muted); }

/* ---------------------------------------------------------------- */
/* Chu cai dau cao hai dong                                          */
/* ---------------------------------------------------------------- */

/*
 * 3.15em tren co chu 17.5px va nhip dong 1.75 cho mot chu cai cao xap xi hai
 * dong. `line-height` phai ep xuong duoi 1, neu khong chu se day dong dau tien
 * cua doan xuong duoi.
 */
.rc-body .rc-lede::first-letter {
	float: left;
	font-family: var(--display);
	font-weight: 500;
	font-size: 3.15em;
	line-height: 0.79;
	margin: 0.06em 0.09em 0 0;
	color: var(--accent);
}

/* ---------------------------------------------------------------- */
/* Danh sach kieu "nguyen lieu"                                      */
/* ---------------------------------------------------------------- */

.rc-ing {
	margin: 0 0 24px;
	padding: 18px 20px 20px;
	background: var(--surface);
	border-top: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
}
.rc-ing-head {
	margin: 0 0 12px;
	font-family: var(--text);
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--muted);
}
.rc-ing-list { list-style: none; margin: 0; padding: 0; }
.rc-ing-list li {
	position: relative;
	padding: 5px 0 5px 24px;
	font-size: 15px;
	line-height: 1.55;
}
/* Mot gach ngang ngan mo dau moi dong - dung nhip cua mot to nguyen lieu. */
.rc-ing-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.83em;
	width: 13px;
	height: 1px;
	background: var(--accent);
}
.rc-ing-list b { font-weight: 700; }

/* ---------------------------------------------------------------- */
/* Van xuoi, anh, danh sach trong phieu                              */
/* ---------------------------------------------------------------- */

.rc-body h3 {
	font-family: var(--display);
	font-weight: 500;
	font-size: 20px;
	line-height: 1.3;
	margin: 30px 0 10px;
}

.rc-body ul, .rc-body ol { margin: 0 0 1.2em; padding-left: 1.25em; }
.rc-body li { margin: 0 0 0.35em; }

.rc-body strong { font-weight: 700; }

.rc-body figure {
	margin: 0 0 24px;
	padding: 0;
	background: var(--surface);
	border: 1px solid var(--line);
}
.rc-body figure img {
	width: 100%;
	max-height: 380px;
	object-fit: contain;
	padding: 20px;
	background: var(--surface);
}
.rc-body figcaption {
	margin: 0;
	padding: 10px 16px 14px;
	border-top: 1px solid var(--line);
	font-family: var(--display);
	font-style: italic;
	font-size: 14px;
	line-height: 1.5;
	color: var(--muted);
	text-align: center;
}

.rc-card-cta { margin: 26px 0 0; }

/* ---------------------------------------------------------------- */
/* Bang so sanh                                                      */
/* ---------------------------------------------------------------- */

/*
 * Bang "Compared" co nam cot, mot trong do la ten day du cua san pham. O
 * 375px bang rong gap doi trang, nen chi RIENG bang duoc cuon - trang dung yen.
 */
.rc-table-wrap {
	overflow-x: auto;
	margin: 0 0 24px;
	border: 1px solid var(--line);
	background: var(--surface);
}
.rc-body table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13.5px;
	line-height: 1.5;
	min-width: 520px;
}
.rc-body th, .rc-body td {
	padding: 10px 14px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid var(--line);
}
.rc-body th {
	font-family: var(--text);
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
	white-space: nowrap;
}
.rc-body tbody tr:last-child td { border-bottom: 0; }

/* ---------------------------------------------------------------- */
/* Dong nguon du lieu                                                */
/* ---------------------------------------------------------------- */

.rc-source-note {
	margin: 44px 0 0;
	padding-top: 18px;
	border-top: 1px solid var(--line);
	font-size: 12.5px;
	line-height: 1.65;
	color: var(--muted);
}

@media (max-width: 560px) {
	.rc-card { margin: 40px 0; }
	.rc-body .rc-lede::first-letter { font-size: 2.95em; }
	.rc-ing { padding: 16px 16px 18px; }
	.rc-body figure img { max-height: 260px; padding: 14px; }
}
