/* ============================================================
   technology.css — Technology（Dark / front-page 専用）
   セクションは .da-section--dark を併用（背景 + Section Title のダーク配色）。
   ============================================================ */

#technology { scroll-margin-top: 80px; }

/* ダーク面のカード */
.da-technology .da-c-card {
	background: var(--da-secondary-700);
	border-color: rgba(255, 255, 255, .08);
	color: var(--da-gray-300);
	transition: var(--da-transition-base);
}
.da-technology .da-c-card__icon { color: var(--da-accent); }
.da-technology .da-c-card__title { color: #fff; }
.da-technology .da-c-card__text { color: var(--da-gray-400); }

/* Hover（Foundation準拠の持ち上げ。ダーク面は境界と背景で表現） */
.da-technology .da-c-card:hover {
	transform: translateY(-2px);
	border-color: rgba(255, 255, 255, .22);
	background: #21335A;
}

/* Reveal スタッガー */
.da-technology__cards .da-c-card:nth-child(2) { --da-reveal-delay: 60ms; }
.da-technology__cards .da-c-card:nth-child(3) { --da-reveal-delay: 120ms; }

/* 下部の小さなメッセージ */
.da-technology__note {
	max-width: 640px;
	margin: var(--da-space-40) auto 0;
	text-align: center;
	font-size: var(--da-fs-small);
	line-height: var(--da-lh-body);
	color: var(--da-gray-400);
}