/* ========================= CARD（SOLUTIONS） ========================= */
.aa-card{
	position:relative;
	display:grid;
	align-content:space-between;
	gap:1em;
	height:100%;
	min-height:clamp(160px,22svh,230px);
	padding:clamp(22px,2.6vw,38px);
	background:var(--bg);
	overflow:hidden;
	transition:background 300ms var(--ease-out);
}
.aa-card::after{
	content:"";
	position:absolute;
	inset:auto 0 0;
	height:2px;
	background:linear-gradient(90deg,var(--c-signal),var(--c-halo));
	transform:scaleX(0);
	transform-origin:left;
	transition:transform 500ms var(--ease-out);
}
.aa-card:hover,
.aa-card:focus-visible{ background:#fff }
.aa-card:hover::after,
.aa-card:focus-visible::after{ transform:scaleX(1) }

.aa-card__index{ color:var(--fg-sub) }
.aa-card__title{ font-size:clamp(1.05rem,1.5vw,1.35rem); font-weight:400 }
.aa-card__excerpt{
	font-size:.86rem;
	line-height:1.8;
	color:var(--fg-sub);
	opacity:0;
	transform:translateY(8px);
	transition:opacity 400ms var(--ease-out), transform 400ms var(--ease-out);
}
.aa-card:hover .aa-card__excerpt,
.aa-card:focus-visible .aa-card__excerpt{ opacity:1; transform:none }
.aa-card__more{ color:var(--c-signal) }

/* タッチ端末ではホバーが無いので常時表示 */
@media (hover:none){
	.aa-card__excerpt{ opacity:1; transform:none }
	.aa-card::after{ transform:scaleX(1) }
}