/* ==========================================================================
   About Page
   ========================================================================== */

/* Concept */
.about-concept__text {
	max-width: 800px;
	margin: 0 auto;
	text-align: center;
}

.about-concept__text p {
	color: var(--color-text-sub);
	line-height: 2;
	margin-bottom: 1.5rem;
}

.about-concept__text p:last-child {
	margin-bottom: 0;
}

/* Features */
.about-features {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 2rem;
}

.about-features__item {
	background-color: #faf7f3;
	border: 1px solid var(--color-border);
	border-radius: 8px;
	padding: 2.5rem 2rem;
	text-align: center;
	transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.about-features__item:hover {
	transform: translateY(-4px);
	box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
}

.about-features__icon {
	color: var(--color-accent-gold);
	margin-bottom: 1.5rem;
}

.about-features__title {
	font-size: 1.25rem;
	margin-bottom: 1rem;
}

.about-features__desc {
	color: var(--color-text-sub);
	font-size: var(--fs-small);
	line-height: 1.8;
}

/* Owner Message */
.about-message {
	max-width: 800px;
	margin: 0 auto;
}

.about-message__body {
	border-left: 3px solid #d45500;
	padding-left: 2rem;
}

.about-message__body p {
	color: var(--color-text-sub);
	line-height: 2;
	margin-bottom: 1.5rem;
}

.about-message__body p:last-child {
	margin-bottom: 0;
}

/* Store Info Table */
.about-info {
	max-width: 800px;
	margin: 0 auto;
}

.about-info__table {
	width: 100%;
	border-collapse: collapse;
}

.about-info__table th,
.about-info__table td {
	padding: 1.25rem 1.5rem;
	border-bottom: 1px solid var(--color-border);
	text-align: left;
}

.about-info__table th {
	width: 30%;
	color: #d45500;
	font-weight: 700;
	font-size: var(--fs-small);
	white-space: nowrap;
}

.about-info__table td {
	color: var(--color-text-sub);
}

/* Responsive */
@media (max-width: 768px) {
	.about-features {
		grid-template-columns: 1fr;
	}

	.about-info__table th,
	.about-info__table td {
		display: block;
		width: 100%;
		padding: 0.75rem 1rem;
	}

	.about-info__table th {
		border-bottom: none;
		padding-bottom: 0.25rem;
	}
}