/* ==========================================================================
   14 PRICING — 料金プラン
   金額は「見せる」より「読ませる」。装飾を抑え、数字と機能の対応を明確にする。
   ========================================================================== */

.aa-pricing{ padding-block:var(--space-block) }

/* --- キャンペーン枠（管理画面でON/OFF） --- */
.aa-campaign{
	position:relative;
	overflow:hidden;
	margin-bottom:clamp(28px,5svh,56px);
	padding:clamp(24px,3.4vw,44px);
	border-radius:2px;
	background:linear-gradient(140deg,#0b1220,#16233d);
	color:var(--c-snow);
	text-align:center;
	box-shadow:0 30px 70px -40px rgb(11 18 32 / .6);
}
/* 上を横切る光 */
.aa-campaign::before{
	content:"";
	position:absolute;
	inset:0 auto auto 0;
	width:100%;
	height:1px;
	background:linear-gradient(90deg,transparent,rgb(127 168 255/.9),transparent);
}
.aa-campaign__label{
	font-family:var(--font-mono);
	font-size:var(--fs-label);
	letter-spacing:var(--ls-label);
	color:var(--c-signal);
	margin-bottom:.9em;
}
.aa-campaign__title{
	font-family:var(--font-display);
	font-weight:500;
	font-size:clamp(1.2rem,2.6vw,2rem);
	line-height:1.5;
}
.aa-campaign__price{
	display:flex;
	align-items:baseline;
	justify-content:center;
	flex-wrap:wrap;
	gap:.5em;
	margin-top:.9em;
}
.aa-campaign__before{
	font-family:var(--font-display);
	font-size:clamp(1rem,1.8vw,1.4rem);
	color:rgb(242 246 255 / .45);
	text-decoration-thickness:1px;
}
.aa-campaign__arrow{ color:var(--c-signal); opacity:.7 }
.aa-campaign__after{
	font-family:var(--font-display);
	font-weight:600;
	font-size:clamp(2rem,4.4vw,3.2rem);
	line-height:1;
	background:linear-gradient(100deg,#fff,var(--c-signal) 70%,var(--c-halo));
	-webkit-background-clip:text;
	background-clip:text;
	color:transparent;
}
.aa-campaign__price span{ font-size:.9rem; color:var(--c-snow-sub) }
.aa-campaign__text{ margin-top:.9em; color:var(--c-snow-sub); font-size:.92rem; line-height:1.9 }
.aa-campaign__period{
	margin-top:1em;
	display:inline-block;
	padding:.5em 1.2em;
	border:1px solid rgb(255 255 255 / .22);
	border-radius:999px;
	font-family:var(--font-mono);
	font-size:.64rem;
	letter-spacing:.12em;
	color:var(--c-snow-sub);
}

/* --- 初期費用 --- */
.aa-pricing__initial{
	display:grid;
	gap:clamp(20px,3vw,48px);
	grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));
	align-items:center;
	margin-bottom:clamp(28px,5svh,56px);
	padding:clamp(24px,3.2vw,44px);
	background:#fff;
	border:1px solid var(--rule);
}
.aa-pricing__initial-label{
	font-family:var(--font-mono);
	font-size:var(--fs-label);
	letter-spacing:var(--ls-label);
	color:var(--fg-sub);
	margin-bottom:.6em;
}
.aa-pricing__initial-price{ display:flex; align-items:baseline; gap:.25em }
.aa-pricing__initial-price b{
	font-family:var(--font-display);
	font-weight:600;
	font-size:clamp(2.2rem,5vw,3.6rem);
	line-height:1;
	letter-spacing:-.01em;
}
.aa-pricing__initial-price span{ font-size:.9rem; color:var(--fg-sub) }
.aa-pricing__initial-note{
	margin-top:.8em;
	font-family:var(--font-mono);
	font-size:.66rem;
	letter-spacing:.14em;
	color:var(--fg-sub);
}
.aa-pricing__initial-items{ display:grid; gap:.6em }
.aa-pricing__initial-items li{
	display:flex;
	gap:.8em;
	align-items:baseline;
	font-size:.9rem;
	line-height:1.8;
}
.aa-pricing__initial-items li::before{ content:"✓"; color:var(--c-signal); flex:0 0 auto }

/* --- プラン一覧 --- */
.aa-pricing__plans{
	display:grid;
	gap:1px;
	background:var(--rule);
	border:1px solid var(--rule);
	grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));
}
.aa-plan{
	position:relative;
	background:var(--bg);
	padding:clamp(24px,2.8vw,38px) clamp(20px,2.4vw,32px);
	display:grid;
	align-content:start;
	/* バッジ / プラン名 / ひとこと / 価格 / 年払い / 機能 の6行で固定し、
	   カード間で各行の位置を揃える */
	grid-template-rows:auto auto auto auto auto 1fr;
	gap:.9em;
	transition:background 300ms var(--ease-out);
}
.aa-plan:hover{ background:#fff }

/* おすすめプランは白地＋上に光の線 */
.aa-plan.is-featured{ background:#fff }
.aa-plan.is-featured::before{
	content:"";
	position:absolute;
	inset:0 0 auto 0;
	height:3px;
	background:linear-gradient(90deg,var(--c-signal),var(--c-halo));
}
/* 非表示でも場所は確保する（行の高さを揃えるため） */
.aa-plan__badge.is-hidden,
.aa-plan__yearly.is-hidden{ visibility:hidden }

.aa-plan__badge{
	justify-self:start;
	padding:.4em 1em;
	border-radius:999px;
	background:var(--c-ink);
	color:var(--c-snow);
	font-family:var(--font-mono);
	font-size:.58rem;
	letter-spacing:.16em;
}
.aa-plan__name{
	font-family:var(--font-display);
	font-weight:600;
	font-size:clamp(1.1rem,1.8vw,1.5rem);
	letter-spacing:.1em;
}
.aa-plan__catch{
	font-size:.86rem;
	color:var(--fg-sub);
	line-height:1.8;
	min-height:3.4em;      /* 2行ぶんを確保して、価格の位置を揃える */
	display:flex;
	align-items:flex-start;
}
.aa-plan__price{
	display:flex;
	align-items:baseline;
	gap:.2em;
	padding-top:.6em;
	border-top:1px solid var(--rule);
}
.aa-plan__price b{
	font-family:var(--font-display);
	font-weight:600;
	font-size:clamp(1.9rem,3.6vw,2.8rem);
	line-height:1;
	letter-spacing:-.01em;
}
.aa-plan__price span{ font-size:.76rem; color:var(--fg-sub) }
.aa-plan__yearly{
	font-family:var(--font-mono);
	font-size:.64rem;
	letter-spacing:.1em;
	color:var(--fg-sub);
}
.aa-plan__features{
	display:grid;
	gap:.55em;
	margin-top:.6em;
	padding-top:1.2em;
	border-top:1px solid var(--rule);
}
.aa-plan__features li{
	display:flex;
	gap:.7em;
	align-items:baseline;
	font-size:.82rem;
	line-height:1.75;
	color:var(--fg-sub);
}
.aa-plan__features li::before{
	content:"";
	flex:0 0 auto;
	width:4px;
	height:4px;
	border-radius:50%;
	background:var(--c-signal);
	transform:translateY(-.25em);
}
/* 「〜のすべて」の行だけ強調して、積み上げが分かるようにする */
.aa-plan__features li:first-child{ color:var(--fg); font-weight:400 }

/* --- 注釈とCTA --- */
.aa-pricing__yearly-note{
	margin-top:clamp(16px,2.4svh,26px);
	text-align:center;
	font-family:var(--font-mono);
	font-size:var(--fs-label);
	letter-spacing:.14em;
	color:var(--c-signal);
}
.aa-pricing__note{
	margin-top:1em;
	text-align:center;
	font-size:.8rem;
	color:var(--fg-sub);
	line-height:1.9;
}
.aa-pricing .aa-button{ margin-top:clamp(28px,5svh,56px) }

@media (max-width:599px){
	.aa-plan__catch{ min-height:0 }
}


/* --- スタッフ数による追加料金 --- */
.aa-headcount{
	margin-top:clamp(28px,5svh,56px);
	padding:clamp(24px,3vw,40px);
	background:#fff;
	border:1px solid var(--rule);
}
.aa-headcount__label{
	font-family:var(--font-mono);
	font-size:var(--fs-label);
	letter-spacing:var(--ls-label);
	color:var(--fg-sub);
	margin-bottom:clamp(16px,2.4svh,26px);
}
.aa-headcount__list{
	display:grid;
	gap:1px;
	background:var(--rule);
	border-block:1px solid var(--rule);
}
.aa-headcount__row{
	display:grid;
	grid-template-columns:1fr auto;
	gap:1em;
	align-items:baseline;
	padding:clamp(12px,1.8vw,18px) 0;
	background:#fff;
}
.aa-headcount__row dt{
	font-size:clamp(.9rem,1.2vw,1.05rem);
}
.aa-headcount__row dd{
	font-family:var(--font-display);
	font-size:clamp(.95rem,1.4vw,1.2rem);
	letter-spacing:.01em;
	text-align:right;
}
/* 最初の行（基本料金内）は控えめに */
.aa-headcount__row:first-child dd{ color:var(--fg-sub); font-family:var(--font-body); font-size:.9rem }
.aa-headcount__note{
	margin-top:1.2em;
	font-size:.8rem;
	color:var(--fg-sub);
	line-height:1.8;
}

@media (max-width:599px){
	.aa-headcount__row{ grid-template-columns:1fr; gap:.2em }
	.aa-headcount__row dd{ text-align:left }
}