@charset "UTF-8";
/**
 * Pricing — 料金プラン 3 段
 *
 * template-parts/pricing-table.php に対応するスタイル。
 *
 * @package dgb-child
 */

.dgb-pricing {
	display: grid;
	gap: var(--dgb-space-lg);
	grid-template-columns: 1fr;
	max-width: var(--dgb-max-content);
	margin-inline: auto;
	padding: var(--dgb-section-pad-y) var(--dgb-container-pad-x);
}

@media (min-width: 768px) {
	.dgb-pricing {
		grid-template-columns: repeat(3, 1fr);
	}
}

.dgb-pricing__plan {
	background: var(--dgb-color-bg);
	border: 1px solid var(--dgb-color-border);
	border-radius: var(--dgb-radius-card);
	padding: var(--dgb-space-xl) var(--dgb-space-lg);
	box-shadow: var(--dgb-shadow-card);
	display: flex;
	flex-direction: column;
	gap: var(--dgb-space-md);
	position: relative;
	transition: box-shadow var(--dgb-dur-base) var(--dgb-ease), transform var(--dgb-dur-base) var(--dgb-ease);
}

.dgb-pricing__plan:hover {
	box-shadow: var(--dgb-shadow-card-hover);
	transform: translateY(-2px);
}

.dgb-pricing__plan--featured {
	border-color: var(--dgb-color-accent);
	box-shadow: var(--dgb-shadow-card-hover);
}

.dgb-pricing__badge {
	position: absolute;
	top: -0.75rem;
	left: 50%;
	transform: translateX(-50%);
	background: var(--dgb-color-accent);
	color: #fff;
	font-size: var(--dgb-fs-small);
	font-weight: var(--dgb-fw-bold);
	padding: 0.25rem 0.75rem;
	border-radius: var(--dgb-radius-pill);
}

.dgb-pricing__name {
	font-size: var(--dgb-fs-h3);
	font-weight: var(--dgb-fw-bold);
	color: var(--dgb-color-primary);
	margin: 0;
}

.dgb-pricing__price {
	font-size: var(--dgb-fs-h2);
	font-weight: var(--dgb-fw-bold);
	color: var(--dgb-color-text);
	margin: 0;
}

.dgb-pricing__per {
	font-size: var(--dgb-fs-small);
	font-weight: var(--dgb-fw-regular);
	color: var(--dgb-color-muted);
}

.dgb-pricing__features {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: var(--dgb-space-sm);
}

.dgb-pricing__features li {
	padding-left: 1.5rem;
	position: relative;
	color: var(--dgb-color-text-soft);
	font-size: var(--dgb-fs-body);
	line-height: var(--dgb-line-base);
}

.dgb-pricing__features li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.65rem;
	width: 0.75rem;
	height: 0.75rem;
	border-radius: 50%;
	background: var(--dgb-color-accent);
}

.dgb-pricing__cta {
	display: inline-block;
	background: var(--dgb-color-primary);
	color: #fff;
	text-align: center;
	padding: 0.875rem 1.5rem;
	border-radius: var(--dgb-radius-md);
	font-weight: var(--dgb-fw-bold);
	text-decoration: none;
	margin-top: auto;
	transition: background var(--dgb-dur-base) var(--dgb-ease);
}

.dgb-pricing__cta:hover {
	background: var(--dgb-color-primary-soft);
}

.dgb-pricing__plan--featured .dgb-pricing__cta {
	background: var(--dgb-color-accent);
}

.dgb-pricing__plan--featured .dgb-pricing__cta:hover {
	background: var(--dgb-color-accent-dark);
}