:root {
	--wnl-v3-ink: #1a1a1a;
	--wnl-v3-muted: #666;
	--wnl-v3-line: rgba(26, 26, 26, .14);
	--wnl-v3-paper: #fff;
	--wnl-v3-soft: #f4f4f1;
	--wnl-v3-dark: #171717;
	--wnl-v3-accent: #72aaa4;
	/* 面(背景・枠線)用のアクセントは上、文字用は下。
	   #72aaa4 は明るすぎて、小さい文字にするとコントラスト比が 2.38 しかない。
	   同じ色味のまま暗くした #4b706c は 4.97(基準は4.5)。 */
	--wnl-v3-accent-ink: #4b706c;
	--wnl-v3-shell: 1180px;
	--wnl-v3-radius: 14px;
}

.wnl-v3-front-active .site-content,
.wnl-v3-front-active .ast-container,
.wnl-v3-front-active #primary {
	width: 100%;
	max-width: none;
	margin: 0;
	padding: 0;
}

.wnl-v3,
.wnl-v3 * {
	box-sizing: border-box;
}

.wnl-v3 {
	color: var(--wnl-v3-ink);
	background: var(--wnl-v3-paper);
	font-family: Arial, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
	line-height: 1.78;
	overflow: hidden;
}

.wnl-v3 a {
	color: inherit;
	text-decoration: none;
}

.wnl-v3 img {
	display: block;
	width: 100%;
	height: auto;
}

.wnl-v3-shell {
	width: min(calc(100% - 48px), var(--wnl-v3-shell));
	margin-inline: auto;
}

.wnl-v3-section {
	padding: clamp(76px, 8vw, 110px) 0;
}

.wnl-v3-overline,
.wnl-v3-card-label {
	margin: 0 0 12px;
	color: var(--wnl-v3-muted);
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: .16em;
	line-height: 1.3;
}

.wnl-v3 h2 {
	margin: 0;
	font-size: clamp(2rem, 4vw, 3.6rem);
	font-weight: 800;
	letter-spacing: -.025em;
	line-height: 1.22;
}

.wnl-v3 h3 {
	margin: 0;
	line-height: 1.42;
}

.wnl-v3-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 24px;
}

.wnl-v3-btn {
	display: inline-flex;
	min-height: 48px;
	align-items: center;
	justify-content: center;
	padding: 12px 24px;
	border: 1px solid transparent;
	border-radius: 999px;
	font-size: 0.875rem;
	font-weight: 800;
	transition: transform .22s ease, background .22s ease, color .22s ease;
}

.wnl-v3-btn:hover,
.wnl-v3-btn:focus-visible {
	transform: translateY(-2px);
}

.wnl-v3-btn--light {
	color: var(--wnl-v3-dark) !important;
	background: #fff;
}

.wnl-v3-btn--ghost-light {
	border-color: rgba(255,255,255,.7);
	color: #fff !important;
	background: transparent;
}

.wnl-v3-btn--dark {
	color: #fff !important;
	background: var(--wnl-v3-dark);
}

.wnl-v3-btn--ghost-dark {
	border-color: var(--wnl-v3-dark);
	color: var(--wnl-v3-dark) !important;
	background: transparent;
}

.wnl-v3-text-link {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	margin-top: 16px;
	font-size: 0.875rem;
	font-weight: 800;
}

.wnl-v3-text-link::after {
	width: 30px;
	height: 1px;
	background: currentColor;
	content: "";
	transition: width .22s ease;
}

.wnl-v3-text-link:hover::after {
	width: 46px;
}

.wnl-v3-center {
	margin-top: 40px;
	text-align: center;
}

/* Hero */
.wnl-v3-hero {
	min-height: 680px;
	display: flex;
	align-items: center;
	color: #fff;
	background: linear-gradient(120deg, #202020, #4a423d);
	background-size: cover;
	background-position: center;
}

.wnl-v3-hero__content {
	padding: 96px 0 64px;
}

.wnl-v3-hero .wnl-v3-overline {
	color: rgba(255,255,255,.72);
}

.wnl-v3-hero h1 {
	margin: 0;
	max-width: 760px;
	color: #fff;
	font-size: clamp(3.4rem, 7.5vw, 7rem);
	font-weight: 900;
	letter-spacing: -.05em;
	line-height: .96;
}

.wnl-v3-hero__subtitle {
	margin: 24px 0 0;
	font-size: clamp(1.25rem, 2.4vw, 2rem);
	font-weight: 600;
}

.wnl-v3-hero__intro {
	max-width: 660px;
	margin: 24px 0 0;
	color: rgba(255,255,255,.84);
	font-size: 1rem;
}

/* Shared split */
.wnl-v3-split {
	display: grid;
	grid-template-columns: minmax(0, .95fr) minmax(380px, 1.05fr);
	align-items: center;
	gap: clamp(48px, 7vw, 90px);
}

.wnl-v3-split--reverse {
	grid-template-columns: minmax(380px, 1.05fr) minmax(0, .95fr);
}

.wnl-v3-copy p:not(.wnl-v3-overline) {
	margin: 24px 0 0;
	color: #555;
}

.wnl-v3-media {
	overflow: hidden;
	border-radius: var(--wnl-v3-radius);
	background: #ddd;
}

.wnl-v3-media img {
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

.wnl-v3-placeholder {
	display: grid;
	min-height: 420px;
	place-items: center;
	color: #777;
	background: linear-gradient(135deg, #e8e8e5, #ccc);
	font-weight: 800;
	letter-spacing: .12em;
}

/* 語句の途中で改行させたくない箇所 */
.wnl-v3-nobr {
	white-space: nowrap;
}

/* Mission 01: 見出し・本文を全幅で組み、画像はその下に全幅で敷く */
.wnl-v3-mission__stack {
	display: block;
}

.wnl-v3-mission__stack .wnl-v3-copy {
	max-width: 100%;
}

.wnl-v3-mission__stack h2 {
	max-width: 26em;
	margin: 0;
	font-size: clamp(2.1rem, 3.5vw, 3rem);
	line-height: 1.45;
}

/* 続きの文章なので横並びにはしない。1カラムのまま、
   行長だけ読みやすい幅(全角40字前後)に制限する */
.wnl-v3-mission__text {
	max-width: 46em;
	margin-top: clamp(28px, 3vw, 40px);
}

.wnl-v3-mission__text p:not(.wnl-v3-overline) {
	margin: 0 0 1.5em;
}

.wnl-v3-mission__text p:last-child {
	margin-bottom: 0;
}

.wnl-v3-mission__stack .wnl-v3-text-link {
	margin-top: clamp(30px, 3.5vw, 44px);
}

.wnl-v3-mission__media {
	margin-top: clamp(46px, 6vw, 76px);
}

.wnl-v3-mission__media img {
	width: 100%;
	aspect-ratio: 21 / 9;
}

.wnl-v3-mission__media .wnl-v3-placeholder {
	min-height: 0;
	aspect-ratio: 21 / 9;
}

.wnl-v3-plain-list {
	display: grid;
	gap: 8px;
	margin: 24px 0 0;
	padding: 24px 0 0;
	border-top: 1px solid var(--wnl-v3-line);
	list-style: none;
}

.wnl-v3-plain-list li {
	position: relative;
	padding-left: 16px;
}

.wnl-v3-plain-list li::before {
	position: absolute;
	top: .78em;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--wnl-v3-accent);
	content: "";
}

/* Section head
   左は見出しの実寸まで縮む(auto)。割合で決めると、短い見出しのときに
   左の列へ使われない幅が残り、そのぶん右の導入文が折り返す。
   「仲間・スタッフ」は実寸393pxなのに列が735pxあり、
   導入文は1行に460px要るのに405pxしかなくて2行になっていた。 */
.wnl-v3-section-head {
	display: grid;
	grid-template-columns: minmax(0, auto) minmax(0, 1fr);
	align-items: end;
	gap: 40px;
	margin-bottom: 40px;
}

.wnl-v3-section-head > p {
	margin: 0;
	color: #666;
}

/* Projects */
.wnl-v3-projects {
	background: var(--wnl-v3-soft);
}

/* カードの枚数に合わせて列が決まる。3固定にすると、2枚のとき
   右に1枚ぶんの空きが残る。280pxを下回ると折り返す */
.wnl-v3-project-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 24px;
}

.wnl-v3-project-card {
	border: 1px solid var(--wnl-v3-line);
	border-radius: var(--wnl-v3-radius);
	background: #fff;
	overflow: hidden;
}

.wnl-v3-project-card__image {
	display: grid;
	aspect-ratio: 16 / 10;
	place-items: center;
	color: #fff !important;
	background: #252525;
	overflow: hidden;
}

.wnl-v3-project-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .3s ease;
}

.wnl-v3-project-card:hover .wnl-v3-project-card__image img {
	transform: scale(1.035);
}

.wnl-v3-project-card__image span {
	font-weight: 900;
	letter-spacing: .15em;
}

.wnl-v3-project-card__body {
	padding: 24px;
}

.wnl-v3-project-card h3 {
	font-size: 1.25rem;
}

.wnl-v3-project-card__body > p:last-child {
	margin: 12px 0 0;
	color: #666;
	font-size: 1rem;
}

/* Support */
/* 支援はこのサイトの要。ここだけ面を反転させる。
   ⚠ 3コースの間に差をつけて目立たせない(格付けしない・hp/DECISIONS.md 1-4)。
      「おすすめ」を1つ置く案は一度採用して取りやめた経緯がある。
      主張させるのは節そのもので、プランは対等のまま。 */
.wnl-v3-support {
	padding: clamp(88px, 10vw, 128px) 0;
	color: var(--wnl-v3-dark);
	background: #e9f0ee;
}

.wnl-v3-support .wnl-v3-overline {
	color: var(--wnl-v3-accent-ink);
}

.wnl-v3-support .wnl-v3-section-head > p {
	color: var(--wnl-v3-muted);
}

.wnl-v3-support h2 {
	color: var(--wnl-v3-dark);
}

.wnl-v3-support-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
}

/* 濃い面の上に置くので、影を強めて浮かせる。3枚とも同じ見た目。 */
.wnl-v3-support-card {
	position: relative;
	padding: 32px;
	border: 0;
	border-radius: var(--wnl-v3-radius);
	color: var(--wnl-v3-dark);
	background: var(--wnl-v3-paper);
	box-shadow: 0 14px 34px rgba(75, 112, 108, .16);
}

.wnl-v3-support-card--featured::before {
	position: absolute;
	top: 16px;
	right: 16px;
	padding: 4px 8px;
	border: 1px solid var(--wnl-v3-line);
	border-radius: 999px;
	color: var(--wnl-v3-muted);
	background: rgba(255,255,255,.7);
	/* 現在このクラスは未使用。3コースは対等に見せる方針(hp/DECISIONS.md 2-3) */
	content: "BASIC";
	font-size: .62rem;
	font-weight: 800;
	letter-spacing: .1em;
}

.wnl-v3-support-card h3 {
	color: var(--wnl-v3-accent-ink);
	font-size: clamp(2.8rem, 5vw, 4.2rem);
	line-height: 1;

	/* 金額は中央に置く(2026-08-25 本人が明示)。パソコンもスマホも同じ。
	   ⚠ ¥ の位置はパソコンとスマホで別。ここでは上付きのまま。 */
	text-align: center;
}

.wnl-v3-support-card h3 span {
	margin-right: 4px;
	font-size: .45em;
	vertical-align: top;
}

.wnl-v3-support-card__lead {
	margin: 16px 0 0;
	font-weight: 700;
}

.wnl-v3-support-card ul {
	display: grid;
	gap: 8px;
	margin: 24px 0 24px;
	padding: 16px 0 0;
	border-top: 1px solid var(--wnl-v3-line);
	list-style: none;
}

.wnl-v3-support-card li {
	position: relative;
	padding-left: 16px;
}

.wnl-v3-support-card li::before {
	position: absolute;
	top: .72em;
	left: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--wnl-v3-accent);
	content: "";
}

.wnl-v3-note {
	margin: 16px 0 0;
	color: var(--wnl-v3-muted);
	font-size: 0.875rem;
}

/* Growth */
.wnl-v3-growth {
	background: #fff;
}

.wnl-v3-tree {
	position: relative;
	min-height: 470px;
	overflow: hidden;
	isolation: isolate;
	background:
		radial-gradient(circle at 50% 18%, rgba(165, 196, 188, .13), transparent 36%),
		linear-gradient(180deg, #eef1ef 0%, #d8ddd9 62%, #b4bab4 100%);
}

.wnl-v3-tree__sky,
.wnl-v3-tree__mist,
.wnl-v3-tree__halo,
.wnl-v3-tree__ground,
.wnl-v3-tree__snow {
	position: absolute;
	inset: 0;
}

.wnl-v3-tree__sky {
	z-index: -3;
	background:
		radial-gradient(circle at 50% 20%, rgba(173, 201, 189, .2), transparent 34%),
		linear-gradient(180deg, #edf1ef 0%, #d4dad7 60%, #bcc3bd 100%);
}

.wnl-v3-tree__mist {
	z-index: -1;
	background:
		radial-gradient(ellipse at 50% 82%, rgba(255,255,255,.42), transparent 55%),
		radial-gradient(ellipse at 35% 88%, rgba(255,255,255,.18), transparent 42%);
	filter: blur(3px);
	opacity: .75;
}

.wnl-v3-tree__halo {
	position: absolute;
	top: 60px;
	left: 50%;
	z-index: 1;
	width: 270px;
	height: 270px;
	border-radius: 50%;
	background:
		radial-gradient(circle, rgba(124, 164, 153, .16) 0%, rgba(124, 164, 153, .07) 42%, transparent 72%);
	transform: translateX(-50%);
	transition: opacity .4s ease, transform .4s ease;
}

.wnl-v3-tree__trunk {
	position: absolute;
	left: 48.5%;
	bottom: 64px;
	z-index: 5;
	width: 7%;
	height: 210px;
	border-radius: 34px 34px 16px 16px;
	background:
		linear-gradient(90deg, #51433b 0%, #6e5a4f 24%, #8a7263 52%, #5a4a41 100%);
	box-shadow:
		inset -6px 0 12px rgba(33, 24, 20, .18),
		inset 6px 0 10px rgba(255,255,255,.06);
	transform-origin: bottom center;
	transition: width .45s ease, height .45s ease, left .45s ease;
}

.wnl-v3-tree__branches {
	position: absolute;
	inset: 0;
	z-index: 4;
	transform-origin: 50% 85%;
	transition: opacity .4s ease, transform .4s ease;
}

.wnl-v3-tree__branch {
	position: absolute;
	left: 49.7%;
	bottom: 200px;
	width: 10px;
	border-radius: 999px;
	background:
		linear-gradient(90deg, #5c4b41, #7b675b 50%, #5a4940);
	transform-origin: bottom center;
}

.wnl-v3-tree__branch--left {
	height: 138px;
	transform: rotate(-44deg);
}

.wnl-v3-tree__branch--left-upper {
	height: 108px;
	bottom: 250px;
	transform: rotate(-18deg);
}

.wnl-v3-tree__branch--right {
	height: 144px;
	transform: rotate(44deg);
}

.wnl-v3-tree__branch--right-upper {
	height: 112px;
	bottom: 254px;
	transform: rotate(18deg);
}

.wnl-v3-tree__canopy {
	position: absolute;
	inset: 0;
	z-index: 6;
	transform-origin: 50% 75%;
	transition: opacity .45s ease, transform .45s ease;
}

.wnl-v3-tree__leaf {
	position: absolute;
	border-radius: 48% 52% 58% 42% / 45% 48% 52% 55%;
	background:
		radial-gradient(circle at 35% 28%, rgba(255,255,255,.12), transparent 34%),
		linear-gradient(180deg, #4d6155, #33443c);
	box-shadow: inset 0 -12px 18px rgba(18, 23, 21, .12);
	transform-origin: 50% 90%;
	transition: opacity .45s ease, transform .45s ease, background .45s ease;
}

.wnl-v3-tree__leaf--1 {
	top: 52px;
	left: 20%;
	width: 34%;
	height: 190px;
}

.wnl-v3-tree__leaf--2 {
	top: 25px;
	left: 41%;
	width: 38%;
	height: 204px;
}

.wnl-v3-tree__leaf--3 {
	top: 108px;
	left: 27%;
	width: 30%;
	height: 170px;
}

.wnl-v3-tree__leaf--4 {
	top: 98px;
	left: 53%;
	width: 26%;
	height: 158px;
}

.wnl-v3-tree__leaf--5 {
	top: 112px;
	left: 40%;
	width: 20%;
	height: 132px;
}

.wnl-v3-tree__roots {
	position: absolute;
	inset: 0;
	z-index: 4;
	transition: opacity .45s ease;
}

.wnl-v3-tree__root {
	position: absolute;
	bottom: 52px;
	width: 88px;
	height: 26px;
	border-radius: 50%;
	background:
		linear-gradient(90deg, rgba(92,75,65,.96), rgba(131,108,92,.92) 50%, rgba(78,63,54,.96));
	transform-origin: center;
	filter: drop-shadow(0 3px 2px rgba(0,0,0,.12));
}

.wnl-v3-tree__root--1 { left: 36%; transform: rotate(16deg); }
.wnl-v3-tree__root--2 { left: 42%; bottom: 44px; width: 96px; transform: rotate(-8deg); }
.wnl-v3-tree__root--3 { left: 51%; transform: rotate(-18deg); }
.wnl-v3-tree__root--4 { left: 56%; bottom: 45px; width: 82px; transform: rotate(10deg); }

.wnl-v3-tree__straw {
	position: absolute;
	right: -9px;
	bottom: 26px;
	left: -9px;
	height: 72px;
	border-radius: 10px;
	background:
		repeating-linear-gradient(
			6deg,
			#d8bd75 0 5px,
			#b89449 5px 8px
		);
	box-shadow:
		inset 0 0 0 2px rgba(99, 68, 26, .18),
		0 3px 6px rgba(0,0,0,.08);
	transform: rotate(-2deg);
}

.wnl-v3-tree__straw::after {
	position: absolute;
	top: 32px;
	right: -6px;
	left: -6px;
	height: 5px;
	border-radius: 999px;
	background: #75562b;
	content: "";
}

.wnl-v3-tree__fruits {
	position: absolute;
	inset: 0;
	z-index: 7;
	pointer-events: none;
	transition: opacity .45s ease;
}

.wnl-v3-fruit {
	position: absolute;
	width: 16px;
	height: 16px;
	padding: 0;
	border: 1px solid rgba(236, 228, 208, .78);
	border-radius: 46% 54% 53% 47%;
	background: linear-gradient(180deg, #9e473b, #5d241f);
	box-shadow:
		0 0 0 2px rgba(255,255,255,.04),
		0 4px 10px rgba(0,0,0,.24);
	cursor: pointer;
	pointer-events: auto;
	transition: transform .2s ease, filter .2s ease;
}

.wnl-v3-fruit:hover,
.wnl-v3-fruit:focus-visible {
	transform: translateY(-1px) scale(1.16);
	filter: brightness(1.08);
}

.wnl-v3-fruit--partner {
	background: linear-gradient(180deg, #b39b55, #6d5a2a);
}

.wnl-v3-fruit:nth-child(1) { top: 25%; left: 35%; }
.wnl-v3-fruit:nth-child(2) { top: 18%; left: 49%; }
.wnl-v3-fruit:nth-child(3) { top: 31%; left: 61%; }
.wnl-v3-fruit:nth-child(4) { top: 39%; left: 44%; }
.wnl-v3-fruit:nth-child(5) { top: 22%; left: 68%; }
.wnl-v3-fruit:nth-child(6) { top: 44%; left: 30%; }
.wnl-v3-fruit:nth-child(7) { top: 28%; left: 56%; }
.wnl-v3-fruit:nth-child(8) { top: 14%; left: 39%; }
.wnl-v3-fruit:nth-child(9) { top: 42%; left: 55%; }
.wnl-v3-fruit:nth-child(10) { top: 24%; left: 59%; }
.wnl-v3-fruit:nth-child(11) { top: 36%; left: 37%; }
.wnl-v3-fruit:nth-child(12) { top: 20%; left: 45%; }
.wnl-v3-fruit:nth-child(n+13) { display: none; }

.wnl-v3-tree__fallen-leaves {
	position: absolute;
	inset: 0;
	z-index: 10;
	pointer-events: none;
}

.wnl-v3-tree__fallen-leaves span {
	position: absolute;
	top: 22%;
	left: 35%;
	width: 9px;
	height: 18px;
	border-radius: 70% 30% 70% 30%;
	background: #91603d;
	opacity: 0;
}

.wnl-v3-tree__fallen-leaves span:nth-child(2) {
	left: 56%;
	animation-delay: .6s;
}

.wnl-v3-tree__fallen-leaves span:nth-child(3) {
	left: 68%;
	animation-delay: 1.2s;
}

.wnl-v3-tree__snow {
	z-index: 3;
	opacity: 0;
	background:
		radial-gradient(circle at 25% 20%, rgba(255,255,255,.82) 0 2px, transparent 2.5px),
		radial-gradient(circle at 70% 18%, rgba(255,255,255,.74) 0 2px, transparent 2.5px),
		radial-gradient(circle at 44% 35%, rgba(255,255,255,.66) 0 1.5px, transparent 2px);
	background-size: 72px 72px, 96px 96px, 54px 54px;
	pointer-events: none;
}

.wnl-v3-tree__ground {
	z-index: 2;
	top: auto;
	height: 86px;
	background:
		radial-gradient(ellipse at 50% 20%, rgba(255,255,255,.16), transparent 60%),
		linear-gradient(180deg, #344139 0%, #232c27 100%);
}

.wnl-v3-tree__message {
	position: absolute;
	right: 18px;
	bottom: 94px;
	z-index: 15;
	max-width: 240px;
	padding: 10px 14px;
	border-radius: 10px;
	color: #fff;
	background: rgba(23,23,23,.88);
	font-size: .78rem;
	opacity: 0;
	transform: translateY(8px);
	transition: opacity .25s ease, transform .25s ease;
	pointer-events: none;
}

.wnl-v3-tree__message.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.wnl-v3-tree[data-stage="0"] .wnl-v3-tree__trunk {
	left: 49.4%;
	width: 2.6%;
	height: 42px;
}

.wnl-v3-tree[data-stage="0"] .wnl-v3-tree__branches,
.wnl-v3-tree[data-stage="0"] .wnl-v3-tree__canopy,
.wnl-v3-tree[data-stage="0"] .wnl-v3-tree__roots,
.wnl-v3-tree[data-stage="0"] .wnl-v3-tree__fruits,
.wnl-v3-tree[data-stage="0"] .wnl-v3-tree__halo {
	opacity: 0;
	pointer-events: none;
}

.wnl-v3-tree[data-stage="1"] .wnl-v3-tree__trunk {
	left: 49%;
	width: 4%;
	height: 92px;
}

.wnl-v3-tree[data-stage="1"] .wnl-v3-tree__branches,
.wnl-v3-tree[data-stage="1"] .wnl-v3-tree__roots,
.wnl-v3-tree[data-stage="1"] .wnl-v3-tree__fruits {
	opacity: 0;
	pointer-events: none;
}

.wnl-v3-tree[data-stage="1"] .wnl-v3-tree__canopy {
	opacity: 1;
	transform: scale(.34) translateY(118px);
}

.wnl-v3-tree[data-stage="1"] .wnl-v3-tree__leaf:not(.wnl-v3-tree__leaf--1) {
	opacity: 0;
}

.wnl-v3-tree[data-stage="2"] .wnl-v3-tree__trunk {
	left: 48.8%;
	width: 5%;
	height: 130px;
}

.wnl-v3-tree[data-stage="2"] .wnl-v3-tree__branches {
	opacity: .85;
}

.wnl-v3-tree[data-stage="2"] .wnl-v3-tree__canopy {
	transform: scale(.56) translateY(52px);
}

.wnl-v3-tree[data-stage="2"] .wnl-v3-tree__fruits {
	opacity: 0;
	pointer-events: none;
}

.wnl-v3-tree[data-stage="2"] .wnl-v3-tree__roots {
	opacity: .75;
}

.wnl-v3-tree[data-stage="3"] .wnl-v3-tree__canopy {
	transform: scale(.78) translateY(18px);
}

.wnl-v3-tree[data-stage="3"] .wnl-v3-tree__roots {
	opacity: .9;
}

.wnl-v3-tree[data-stage="4"] .wnl-v3-tree__canopy {
	transform: scale(.92);
}

.wnl-v3-tree[data-stage="5"] .wnl-v3-tree__canopy {
	transform: scale(1);
}

.wnl-v3-tree.is-spring .wnl-v3-tree__leaf--1,
.wnl-v3-tree.is-spring .wnl-v3-tree__leaf--2,
.wnl-v3-tree.is-spring .wnl-v3-tree__leaf--3,
.wnl-v3-tree.is-spring .wnl-v3-tree__leaf--4,
.wnl-v3-tree.is-spring .wnl-v3-tree__leaf--5 {
	background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.14), transparent 34%), linear-gradient(180deg, #6b8460, #465a42);
}

.wnl-v3-tree.is-summer .wnl-v3-tree__leaf--1,
.wnl-v3-tree.is-summer .wnl-v3-tree__leaf--2,
.wnl-v3-tree.is-summer .wnl-v3-tree__leaf--3,
.wnl-v3-tree.is-summer .wnl-v3-tree__leaf--4,
.wnl-v3-tree.is-summer .wnl-v3-tree__leaf--5 {
	background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.1), transparent 34%), linear-gradient(180deg, #4b6155, #2d3e37);
}

.wnl-v3-tree.is-autumn .wnl-v3-tree__leaf--1,
.wnl-v3-tree.is-autumn .wnl-v3-tree__leaf--2,
.wnl-v3-tree.is-autumn .wnl-v3-tree__leaf--3,
.wnl-v3-tree.is-autumn .wnl-v3-tree__leaf--4,
.wnl-v3-tree.is-autumn .wnl-v3-tree__leaf--5 {
	background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.08), transparent 34%), linear-gradient(180deg, #87573d, #553228);
}

.wnl-v3-tree.is-autumn.is-windy .wnl-v3-tree__fallen-leaves span {
	animation: wnl-v3-leaf-fall 2.2s ease-in forwards;
}

.wnl-v3-tree.is-winter .wnl-v3-tree__canopy {
	opacity: .14;
}

.wnl-v3-tree.is-winter .wnl-v3-tree__leaf {
	background: linear-gradient(180deg, #6f7678, #50575a);
}

.wnl-v3-tree.is-winter .wnl-v3-tree__snow {
	opacity: .72;
	animation: wnl-v3-snow 12s linear infinite;
}

.wnl-v3-tree.is-winter .wnl-v3-tree__sky {
	background: linear-gradient(180deg, #dfe5e7 0%, #cbd2d3 72%);
}

.wnl-v3-tree.is-winter .wnl-v3-tree__halo {
	background: radial-gradient(circle, rgba(165, 181, 188, .16) 0%, rgba(165, 181, 188, .06) 42%, transparent 72%);
}

.wnl-v3-tree.is-windy .wnl-v3-tree__leaf--1 {
	animation: wnl-v3-wind-left 1s ease-in-out;
}

.wnl-v3-tree.is-windy .wnl-v3-tree__leaf--2 {
	animation: wnl-v3-wind-center 1s ease-in-out;
}

.wnl-v3-tree.is-windy .wnl-v3-tree__leaf--3,
.wnl-v3-tree.is-windy .wnl-v3-tree__leaf--4,
.wnl-v3-tree.is-windy .wnl-v3-tree__leaf--5 {
	animation: wnl-v3-wind-right 1s ease-in-out;
}

.wnl-v3-tree.is-windy .wnl-v3-tree__branch--left,
.wnl-v3-tree.is-windy .wnl-v3-tree__branch--left-upper {
	animation: wnl-v3-branch-left 1s ease-in-out;
}

.wnl-v3-tree.is-windy .wnl-v3-tree__branch--right,
.wnl-v3-tree.is-windy .wnl-v3-tree__branch--right-upper {
	animation: wnl-v3-branch-right 1s ease-in-out;
}

.wnl-v3-tree.is-windy .wnl-v3-tree__halo {
	animation: wnl-v3-halo 1.1s ease-in-out;
}

@keyframes wnl-v3-wind-left {
	0%,100% { transform: rotate(0deg); }
	45% { transform: rotate(3deg) translateX(5px); }
}

@keyframes wnl-v3-wind-right {
	0%,100% { transform: rotate(0deg); }
	45% { transform: rotate(4deg) translateX(7px); }
}

@keyframes wnl-v3-wind-center {
	0%,100% { transform: rotate(0deg); }
	45% { transform: rotate(2deg) translateX(4px); }
}

@keyframes wnl-v3-branch-left {
	0%,100% { transform: rotate(-44deg); }
	45% { transform: rotate(-41deg); }
}

@keyframes wnl-v3-branch-right {
	0%,100% { transform: rotate(44deg); }
	45% { transform: rotate(47deg); }
}

@keyframes wnl-v3-halo {
	0%,100% { transform: translateX(-50%) scale(1); opacity: 1; }
	50% { transform: translateX(-50%) scale(1.03); opacity: .85; }
}

@keyframes wnl-v3-leaf-fall {
	0% { opacity: 0; transform: translate(0,0) rotate(0); }
	15% { opacity: 1; }
	100% { opacity: 0; transform: translate(70px,250px) rotate(280deg); }
}

@keyframes wnl-v3-snow {
	from { background-position: 0 0, 0 0, 0 0; }
	to { background-position: 0 180px, 0 240px, 0 150px; }
}

/* Partners */
.wnl-v3-partners {
	background: var(--wnl-v3-soft);
}

/* auto-fill にする。auto-fit だと1社のときカードが1180pxまで伸びる。
   auto-fill は空の列を残すので、カードの幅は280px前後で一定になる。 */
.wnl-v3-partner-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 12px;
}

.wnl-v3-partner-card {
	padding: 16px;
	border: 1px solid var(--wnl-v3-line);
	border-radius: 14px;
	background: #fff;
}

.wnl-v3-partner-card__logo {
	display: grid;
	height: 105px;
	place-items: center;
	padding: 16px;
	background: #f8f8f6;
	overflow: hidden;
}

/* max-width/max-height だと枠(105px)に収まらず、はみ出して切れる。
   枠と同じ大きさを与えたうえで contain させる。 */
.wnl-v3-partner-card__logo img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.wnl-v3-partner-card__logo span {
	font-size: 2.5rem;
	font-weight: 300;
}

.wnl-v3-partner-card > p {
	margin: 16px 0 4px;
	color: #777;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: .1em;
}

.wnl-v3-partner-card h3 {
	font-size: 1rem;
}

/* Members */
.wnl-v3-member-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

/* 正方形。顔写真なので 4:3 にすると耳と口が切れる */
.wnl-v3-member-card__image {
	display: grid;
	aspect-ratio: 1 / 1;
	place-items: center;
	border-radius: 14px;
	color: #fff !important;
	background: #292929;
	overflow: hidden;
}

.wnl-v3-member-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.wnl-v3-member-card__image span {
	font-size: 1.15rem;
	font-weight: 800;
}

.wnl-v3-member-card > p {
	margin: 16px 0 4px;
	color: #777;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: .1em;
}

.wnl-v3-member-card h3 {
	font-size: 1.25rem;
}

.wnl-v3-member-card > div:last-child {
	margin-top: 8px;
	color: #666;
	font-size: 0.875rem;
}

/* Journal */
.wnl-v3-journal {
	background: var(--wnl-v3-soft);
}

.wnl-v3-news-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 24px;
}

.wnl-v3-news-card {
	background: #fff;
	border-radius: 14px;
	overflow: hidden;
}

.wnl-v3-news-card__image {
	display: grid;
	aspect-ratio: 16 / 10;
	place-items: center;
	color: #fff !important;
	background: #252525;
	overflow: hidden;
}

.wnl-v3-news-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.wnl-v3-news-card__body {
	padding: 24px;
}

.wnl-v3-news-card time {
	display: block;
	margin-bottom: 8px;
	color: #777;
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: .08em;
}

.wnl-v3-news-card h3 {
	font-size: 1.125rem;
}

.wnl-v3-news-card p {
	margin: 12px 0 0;
	color: #666;
	font-size: 1rem;
}

/* Shop */
.wnl-v3-shop__inner {
	display: grid;
	grid-template-columns: minmax(380px, 1.05fr) minmax(0, .95fr);
	align-items: center;
	gap: clamp(46px, 7vw, 84px);
}

/* ⚠ ここは写真ではなく「円の中で寄り添う犬と猫」の絵(2026-08-25)。
   切ると円が欠ける。角丸の箱にも入れない。地の白のまま置く。 */
.wnl-v3-shop__image {
	border-radius: 0;
	overflow: visible;
}

.wnl-v3-shop__image img {
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: contain;

	/* JPEGの白地が、地の色(#f4f4f1)の上で白い四角に見えてしまう。
	   黒一色の線画なので、掛け合わせて白を地になじませる。 */
	mix-blend-mode: multiply;
}

/* Motion */
.wnl-v3-reveal {
	opacity: 0;
	transform: translateY(22px);
	transition: opacity .65s ease, transform .65s ease;
}

.wnl-v3-reveal.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.wnl-v3 :focus-visible {
	outline: 3px solid var(--wnl-v3-accent);
	outline-offset: 3px;
}

/* ==================================================================
   可読性・バランス調整
   ・#777はコントラスト比4.48:1でWCAG AA(4.5:1)を下回るため是正
   ・日本語の小さい文字(.66rem≒10.6px)は判読しづらいため底上げ
   ・見出しが不自然な位置で折れるのを抑制
   ・記事が少ないときにグリッドが空いて見えるのを解消
   ================================================================== */

:root {
	--wnl-v3-muted: #4f4f4f;
}

/* --- 本文 --- */
.wnl-v3-copy p:not(.wnl-v3-overline) {
	color: #3d3d3d;
	font-size: 1rem;
	line-height: 1.95;
}

.wnl-v3-section-head > p {
	color: #474747;
	font-size: 1rem;
	line-height: 1.9;
}

/* 見出し脇のリンクは、説明文が無いとき中途半端な位置に浮くので右端へ寄せる */
.wnl-v3-section-head > .wnl-v3-text-link {
	justify-self: end;
}

/* 支援カード: min-heightで行が引き伸ばされ、項目数の違うカード間で
   行間がバラついていたので上詰めにする */
.wnl-v3-support-card ul {
	align-content: start;
	gap: 12px;
}

/* テキストリンク:裸の線だと何を示すか伝わらないので矢印にする。
   ::before を flex の order で末尾に回して矢じりにしている */
.wnl-v3-text-link {
	gap: 12px;
	font-size: 0.875rem;
	font-weight: 700;
	letter-spacing: .02em;
	transition: color .22s ease;
}

.wnl-v3-text-link::after {
	order: 2;
	width: 36px;
	height: 1.5px;
	transition: width .22s ease;
}

.wnl-v3-text-link::before {
	order: 3;
	width: 6px;
	height: 6px;
	margin-left: -15px;
	border-top: 1.5px solid currentColor;
	border-right: 1.5px solid currentColor;
	transform: rotate(45deg);
	content: "";
}

.wnl-v3-text-link:hover {
	color: var(--wnl-v3-accent-ink);
}

.wnl-v3-text-link:hover::after {
	width: 50px;
}

/* --- カード内の小さな文字 --- */
.wnl-v3-partner-card > p,
.wnl-v3-member-card > p {
	color: #4f4f4f;
	font-size: 0.75rem;
}

.wnl-v3-member-card > div:last-child,
.wnl-v3-project-card__body > p:last-child,
.wnl-v3-news-card p {
	color: #444;
	font-size: 1rem;
	line-height: 1.85;
}

.wnl-v3-news-card time {
	color: #575757;
	font-size: 0.75rem;
}

.wnl-v3-card-label {
	font-size: 0.75rem;
}

.wnl-v3-tree__message {
	font-size: .9rem;
}

.wnl-v3-placeholder {
	color: #5f5f5f;
}

/* --- 2カラム内の見出しは、折り返しが不自然にならない大きさに --- */
.wnl-v3-split h2,
.wnl-v3-split--reverse h2 {
	font-size: clamp(1.9rem, 2.85vw, 2.55rem);
	line-height: 1.44;
	text-wrap: balance;
}

/* 件数が少ないときのグリッド調整は、メディアクエリに上書きされないよう
   このファイルの最後にまとめてある(「件数が少ないときのレイアウト」を参照) */

@media (max-width: 1024px) {
	.wnl-v3-project-grid,
	.wnl-v3-member-grid,
	.wnl-v3-news-grid,
	.wnl-v3-support-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.wnl-v3-partner-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.wnl-v3-shell {
		width: min(calc(100% - 32px), var(--wnl-v3-shell));
	}

	.wnl-v3-section {
		padding: 64px 0;
	}

	.wnl-v3-hero {
		min-height: 620px;
		background-position: 58% center;
	}

	.wnl-v3-hero__content {
		padding: 64px 0 64px;
	}

	.wnl-v3-hero h1 {
		font-size: clamp(3.2rem, 17vw, 5.5rem);
	}

	.wnl-v3-hero__intro {
		font-size: 1rem;
	}

	.wnl-v3-actions,
	.wnl-v3-actions .wnl-v3-btn {
		width: 100%;
	}

	.wnl-v3-split,
	.wnl-v3-split--reverse,
	.wnl-v3-shop__inner,
	.wnl-v3-section-head {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.wnl-v3-split--reverse .wnl-v3-media {
		order: 2;
	}

	.wnl-v3-project-grid,
	.wnl-v3-support-grid,
	.wnl-v3-partner-grid,
	.wnl-v3-member-grid,
	.wnl-v3-news-grid {
		grid-template-columns: 1fr;
	}

	.wnl-v3-placeholder {
		min-height: 320px;
	}

	/* 1カラムになるスマホでは、見出し脇リンクの右寄せを解除する */
	.wnl-v3-section-head > .wnl-v3-text-link {
		justify-self: start;
	}

	/* Mission 01: スマホでは本文を1カラム、画像も縦長寄りに */
	.wnl-v3-mission__text {
		max-width: 100%;
	}

	.wnl-v3-mission__media img,
	.wnl-v3-mission__media .wnl-v3-placeholder {
		aspect-ratio: 4 / 3;
	}

	.wnl-v3-tree {
		min-height: 390px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wnl-v3 *,
	.wnl-v3 *::before,
	.wnl-v3 *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}

	.wnl-v3-reveal {
		opacity: 1;
		transform: none;
	}
}


/* v8: symmetrical layout refinements */
.wnl-v3-project-grid {
	align-items: stretch;
}

.wnl-v3-project-card {
	display: flex;
	height: 100%;
	flex-direction: column;
}

.wnl-v3-project-card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
}

/* 見出しを2行に折って高さを揃えていたが、3枚とも1行に収まるようにしたので
   高さの確保は不要になった。min-heightを残すと、文字29pxに対して枠が74pxになり、
   見出しの下に45pxの空白だけが残る */
.wnl-v3-project-card h3 {
	display: flex;
	align-items: flex-start;
}

.wnl-v3-project-card__body > p:last-child {
	min-height: 5.4em;
}

.wnl-v3-support-grid {
	align-items: stretch;
}

.wnl-v3-support-card {
	display: flex;
	min-height: 470px;
	flex-direction: column;
}

.wnl-v3-support-card h3 {
	margin-top: 4px;
}

/* ⚠ 3.55em(約2.2行分)を空けていたが、説明文は3枚とも1行になった。
   その差がそのまま空白として残っていた(2026-08-25 本人が指摘。2回目)。
   ボタンの位置は下の margin-top:auto で揃うので、ここで高さを稼ぐ必要はない。
   ⚠ 説明文を2行に戻すときは、ここも一緒に見直す。 */
.wnl-v3-support-card__lead {
	min-height: 1.6em;
	line-height: 1.6;
}

.wnl-v3-support-card ul {
	min-height: 156px;
}

.wnl-v3-support-card .wnl-v3-btn {
	width: 100%;
	margin-top: auto;
}

.wnl-v3-support-card--featured::before {
	top: 18px;
	right: 18px;
}

/* 幅の上限も justify-self も置かない。列の幅がそのまま箱の幅になる。
   460pxで止めていたころ、「仲間・スタッフ」の導入文は738pxあれば
   1行に収まるのに、460pxで切られて2行になっていた。
   justify-self を付けると箱が中身の幅まで縮み、文中の <br> で
   区切られた片方が箱幅を決めてしまって、もう片方が折り返す。 */

.wnl-v3-copy {
	max-width: 560px;
}

.wnl-v3-copy p:not(.wnl-v3-overline) {
	max-width: 34em;
}

@media (max-width: 1024px) {
	.wnl-v3-project-card h3,
	.wnl-v3-project-card__body > p:last-child,
	.wnl-v3-support-card__lead,
	.wnl-v3-support-card ul {
		min-height: 0;
	}
}

@media (max-width: 767px) {
	.wnl-v3-support-card {
		min-height: 0;
	}

	.wnl-v3-section-head > p {
		max-width: none;
		justify-self: start;
	}
}


/* v11: 円環樹 新芽シーン */
.wnl-v3-enkanju-scene {
	position: relative;
	min-height: 470px;
	overflow: hidden;
	border-radius: var(--wnl-v3-radius);
	background: #071b1d;
	isolation: isolate;
}

.wnl-v3-enkanju-scene__image {
	position: absolute;
	inset: -2%;
	z-index: 1;
	background-size: cover;
	background-position: center;
	transform: scale(1.03);
	filter: saturate(.98) contrast(1.03);
	transition: transform 1.2s ease;
}

.wnl-v3-enkanju-scene::after {
	position: absolute;
	inset: 0;
	z-index: 8;
	background:
		linear-gradient(180deg, rgba(4, 18, 20, .04), rgba(4, 18, 20, .18)),
		radial-gradient(circle at 50% 42%, transparent 0 34%, rgba(2, 15, 17, .18) 100%);
	content: "";
	pointer-events: none;
}

.wnl-v3-enkanju-scene__wind,
.wnl-v3-enkanju-scene__leaves,
.wnl-v3-enkanju-scene__sparkles {
	position: absolute;
	inset: 0;
	z-index: 5;
	pointer-events: none;
}

.wnl-v3-enkanju-wisp {
	position: absolute;
	border-radius: 50%;
	border-top: 2px solid rgba(184, 241, 232, .42);
	border-right: 1px solid rgba(184, 241, 232, .14);
	opacity: 0;
	filter: blur(.3px);
	transform: rotate(-10deg) scaleX(.7);
}

.wnl-v3-enkanju-wisp--1 {
	top: 30%;
	left: 6%;
	width: 58%;
	height: 22%;
}

.wnl-v3-enkanju-wisp--2 {
	top: 47%;
	left: 30%;
	width: 62%;
	height: 18%;
}

.wnl-v3-enkanju-wisp--3 {
	top: 18%;
	left: 42%;
	width: 48%;
	height: 16%;
}

.wnl-v3-enkanju-leaf {
	position: absolute;
	width: 14px;
	height: 26px;
	border-radius: 80% 20% 80% 20%;
	background:
		linear-gradient(145deg, #d6f7af 0%, #79ad59 52%, #2f6039 100%);
	box-shadow: 0 0 12px rgba(184, 242, 137, .28);
	opacity: .72;
	transform-origin: 50% 100%;
}

.wnl-v3-enkanju-leaf--1 { top: 16%; left: 17%; transform: rotate(28deg); }
.wnl-v3-enkanju-leaf--2 { top: 24%; right: 16%; transform: rotate(-22deg) scale(.82); }
.wnl-v3-enkanju-leaf--3 { top: 54%; left: 10%; transform: rotate(52deg) scale(.72); }
.wnl-v3-enkanju-leaf--4 { top: 62%; right: 11%; transform: rotate(-40deg) scale(.64); }

.wnl-v3-enkanju-scene__sparkles span {
	position: absolute;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: rgba(244, 239, 174, .95);
	box-shadow: 0 0 12px rgba(244, 239, 174, .9);
	animation: wnl-v3-enkanju-twinkle 3.6s ease-in-out infinite;
}

.wnl-v3-enkanju-scene__sparkles span:nth-child(1) { top: 22%; left: 38%; }
.wnl-v3-enkanju-scene__sparkles span:nth-child(2) { top: 35%; left: 62%; animation-delay: .7s; }
.wnl-v3-enkanju-scene__sparkles span:nth-child(3) { top: 57%; left: 47%; animation-delay: 1.4s; }
.wnl-v3-enkanju-scene__sparkles span:nth-child(4) { top: 43%; left: 28%; animation-delay: 2.1s; }
.wnl-v3-enkanju-scene__sparkles span:nth-child(5) { top: 18%; left: 72%; animation-delay: 2.8s; }

.wnl-v3-enkanju-scene__straw {
	position: absolute;
	left: 46%;
	bottom: 16%;
	z-index: 7;
	width: 9%;
	height: 14%;
	border-radius: 8px;
	background:
		repeating-linear-gradient(
			6deg,
			#d8bd75 0 5px,
			#b89449 5px 8px
		);
	box-shadow: 0 4px 10px rgba(0,0,0,.22);
	opacity: .92;
	transform: rotate(-2deg);
}

/* 5秒ごとの風 */
.wnl-v3-enkanju-scene.is-windy .wnl-v3-enkanju-scene__image {
	animation: wnl-v3-enkanju-camera-breeze 1.15s ease-in-out;
}

.wnl-v3-enkanju-scene.is-windy .wnl-v3-enkanju-wisp {
	animation: wnl-v3-enkanju-wisp 1.15s ease-out;
}

.wnl-v3-enkanju-scene.is-windy .wnl-v3-enkanju-wisp--2 { animation-delay: .08s; }
.wnl-v3-enkanju-scene.is-windy .wnl-v3-enkanju-wisp--3 { animation-delay: .16s; }

.wnl-v3-enkanju-scene.is-windy .wnl-v3-enkanju-leaf--1 {
	animation: wnl-v3-enkanju-leaf-left 1.15s ease-in-out;
}

.wnl-v3-enkanju-scene.is-windy .wnl-v3-enkanju-leaf--2,
.wnl-v3-enkanju-scene.is-windy .wnl-v3-enkanju-leaf--4 {
	animation: wnl-v3-enkanju-leaf-right 1.15s ease-in-out;
}

.wnl-v3-enkanju-scene.is-windy .wnl-v3-enkanju-leaf--3 {
	animation: wnl-v3-enkanju-leaf-float 1.15s ease-in-out;
}

@keyframes wnl-v3-enkanju-camera-breeze {
	0%,100% { transform: scale(1.03) translateX(0); }
	45% { transform: scale(1.035) translateX(3px); }
}

@keyframes wnl-v3-enkanju-wisp {
	0% {
		opacity: 0;
		transform: translateX(-28px) rotate(-10deg) scaleX(.62);
	}
	28% { opacity: .62; }
	100% {
		opacity: 0;
		transform: translateX(54px) rotate(-7deg) scaleX(1);
	}
}

@keyframes wnl-v3-enkanju-leaf-left {
	0%,100% { transform: rotate(28deg) translate(0,0); }
	45% { transform: rotate(43deg) translate(9px,3px); }
}

@keyframes wnl-v3-enkanju-leaf-right {
	0%,100% { transform: rotate(-22deg) translate(0,0); }
	45% { transform: rotate(-8deg) translate(12px,4px); }
}

@keyframes wnl-v3-enkanju-leaf-float {
	0%,100% { transform: rotate(52deg) scale(.72) translate(0,0); }
	45% { transform: rotate(70deg) scale(.72) translate(14px,-5px); }
}

@keyframes wnl-v3-enkanju-twinkle {
	0%,100% { opacity: .25; transform: scale(.72); }
	50% { opacity: 1; transform: scale(1.25); }
}

.wnl-v3-enkanju-scene .wnl-v3-tree__fruits {
	z-index: 9;
}

.wnl-v3-enkanju-scene .wnl-v3-tree__message {
	z-index: 12;
}

/* 新芽段階は果実を表示しない */
.wnl-v3-enkanju-scene[data-stage="0"] .wnl-v3-tree__fruits,
.wnl-v3-enkanju-scene[data-stage="1"] .wnl-v3-tree__fruits,
.wnl-v3-enkanju-scene[data-stage="2"] .wnl-v3-tree__fruits {
	opacity: 0;
	pointer-events: none;
}

@media (max-width: 767px) {
	.wnl-v3-enkanju-scene {
		min-height: 390px;
	}

	.wnl-v3-enkanju-scene__image {
		background-position: 51% center;
	}
}

@media (prefers-reduced-motion: reduce) {
	.wnl-v3-enkanju-scene__sparkles span {
		animation: none;
	}
}

/* =========================================================
   v12 THEME-INTEGRATED TYPOGRAPHY & MOBILE DESIGN
   追加CSSを使わず、テーマだけで適用される最終調整
   ========================================================= */

/* ---------- Typography ---------- */

body,
button,
input,
textarea,
select {
	font-family: "Zen Maru Gothic", sans-serif;
	font-weight: 500;
}

.wnl-v3-hero h1,
.wnl-v3-overline {
	font-family: "Zen Maru Gothic", sans-serif;
	font-weight: 900;
}

.wnl-v3-section h2,
.wnl-v3-project-card h3,
.wnl-v3-support-card h3,
.wnl-v3-btn,
.wnl-v3-text-link {
	font-family: "Zen Maru Gothic", sans-serif;
	font-weight: 700;
}

/* ---------- Mobile ---------- */

@media screen and (max-width: 767px) {

	html,
	body {
		overflow-x: hidden;
	}

	/* Page width and common spacing */
	.wnl-v3-shell {
		width: 100%;
		max-width: 100%;
		margin-inline: auto;
		padding-inline: 24px;
		box-sizing: border-box;
	}

	.wnl-v3-section {
		padding-block: 48px;
	}

	.wnl-v3-section-head,
	.wnl-v3-copy {
		width: 100%;
		max-width: 100%;
		margin-inline: auto;
	}

	/* スマホでは飾りの英字を画面から外す(2026-08-25 本人が明示)。
	   8.8pxまで縮んで点にしか見えず、読めないため。
	   ⚠ 消さずに残す。読み上げソフトと検索には「どの節か」を伝えたい。
	      display:none にすると、そこも消える。 */
	.wnl-v3-section .wnl-v3-overline {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		padding: 0;
		overflow: hidden;
		white-space: nowrap;
		clip-path: inset(50%);
	}

	.wnl-v3-section h2 {
		max-width: 100%;
		margin: 0 0 16px;
		font-size: 1.5rem;
		line-height: 1.34;
		letter-spacing: -.035em;
		word-break: normal;
		overflow-wrap: break-word;
	}

	.wnl-v3-section p {
		max-width: 100%;
		margin-top: 0;
		margin-bottom: 16px;
		font-size: 1rem;
		line-height: 1.9;
		letter-spacing: .005em;
		word-break: normal;
		overflow-wrap: break-word;
	}

	/* Hero */
	.wnl-v3-hero {
		position: relative;
		display: flex;
		align-items: flex-end;
		width: 100%;
		height: 480px;
		min-height: 480px;
		background-size: cover;
		background-position: center 32%;
		background-repeat: no-repeat;
		overflow: hidden;
		box-shadow:
			inset 0 -245px 165px -75px rgba(0, 0, 0, .92);
	}

	.wnl-v3-hero__content {
		position: relative;
		z-index: 2;
		width: 100%;
		max-width: none;
		margin: 0;
		padding: 0 24px 24px;
		box-sizing: border-box;
		overflow: visible;
		text-align: left;
	}

	.wnl-v3-hero .wnl-v3-overline {
		margin: 0 0 8px;
		font-size: 0.75rem;
		line-height: 1.2;
		letter-spacing: .19em;
	}

	.wnl-v3-hero h1 {
		width: 100%;
		max-width: 100%;
		margin: 0;
		font-size: clamp(1.7rem, 8.3vw, 2rem);
		line-height: 1.02;
		letter-spacing: -.045em;
		white-space: nowrap;
		word-break: normal;
		overflow-wrap: normal;
		overflow: visible;
	}

	.wnl-v3-hero__subtitle {
		margin: 12px 0 0;
		font-size: 0.875rem;
		line-height: 1.5;
		font-weight: 600;
		letter-spacing: .01em;
	}

	.wnl-v3-hero__intro {
		display: none;
	}

	.wnl-v3-hero .wnl-v3-actions {
		display: block;
		margin-top: 16px;
	}

	.wnl-v3-hero .wnl-v3-btn {
		width: 100%;
		min-height: 46px;
		padding: 12px 16px;
		font-size: 0.75rem;
		line-height: 1.4;
		border-radius: 999px;
	}

	.wnl-v3-hero .wnl-v3-btn--ghost-light {
		display: none;
	}

	/* Mission */
	.wnl-v3-mission .wnl-v3-copy {
		width: 100%;
		max-width: 100%;
		margin: 0 auto;
		padding: 0;
		text-align: left;
	}

	.wnl-v3-mission h2,
	.wnl-v3-mission__stack h2 {
		max-width: 100%;
		margin: 0;
		font-size: 1.5rem;
		line-height: 1.38;
	}

	.wnl-v3-mission .wnl-v3-copy p:not(.wnl-v3-overline),
	.wnl-v3-mission__text p:not(.wnl-v3-overline) {
		margin-bottom: 16px;
		font-size: 0.875rem;
		line-height: 1.95;
	}

	.wnl-v3-mission .wnl-v3-plain-list {
		display: grid;
		gap: 12px;
		width: 100%;
		margin: 24px 0 0;
		padding: 24px 0 0;
		border-top: 1px solid #dedede;
	}

	.wnl-v3-mission .wnl-v3-plain-list li {
		margin: 0;
		padding-left: 1.25em;
		font-size: 0.875rem;
		line-height: 1.78;
		word-break: normal;
		overflow-wrap: break-word;
	}

	.wnl-v3-mission .wnl-v3-text-link {
		display: inline-flex;
		align-items: center;
		margin-top: 24px;
		font-size: 0.75rem;
		line-height: 1.4;
	}

	.wnl-v3-mission .wnl-v3-text-link::after {
		width: 30px;
		margin-left: 0;
	}

	.wnl-v3-mission .wnl-v3-media {
		width: 100%;
		margin-top: 32px;
	}

	.wnl-v3-mission .wnl-v3-media img,
	.wnl-v3-mission .wnl-v3-image-placeholder {
		width: 100%;
		border-radius: 14px;
	}

	/* Product development heading */
	.wnl-v3-projects .wnl-v3-section-head,
	.wnl-v3-projects .wnl-v3-section-head .wnl-v3-overline {
		text-align: center;
	}

	.wnl-v3-projects h2 {
		position: relative;
		width: 100%;
		max-width: 100%;
		margin: 0 0 16px;
		font-size: 0;
		line-height: 0;
		text-align: center;
	}

	.wnl-v3-projects h2::after {
		content: "商品開発\A 仕組みづくり";
		display: block;
		white-space: pre-line;
		max-width: 8em;
		margin: 0 auto;
		font-size: 1.68rem;
		line-height: 1.28;
		letter-spacing: -.02em;
		font-weight: 700;
		color: inherit;
		word-break: keep-all;
		text-align: center;
	}

	.wnl-v3-projects .wnl-v3-section-head > p {
		max-width: 310px;
		margin-inline: auto;
		text-align: center;
	}

	.wnl-v3-project-grid {
		display: grid;
		grid-template-columns: 1fr;
		gap: 16px;
		margin-top: 24px;
	}

	.wnl-v3-project-card {
		height: auto;
		min-height: 0;
		padding: 24px 16px;
		border-radius: 14px;
		box-sizing: border-box;
	}

	.wnl-v3-project-card__body {
		padding: 0;
	}

	.wnl-v3-project-card .wnl-v3-card-label {
		margin-bottom: 8px;
		font-size: 0.75rem;
		line-height: 1.3;
		letter-spacing: .16em;
	}

	.wnl-v3-project-card h3 {
		min-height: 0;
		margin: 0 0 12px;
		font-size: 1.125rem;
		line-height: 1.48;
		letter-spacing: -.015em;
	}

	.wnl-v3-project-card p {
		margin: 0;
		font-size: 1rem;
		line-height: 1.84;
	}

	.wnl-v3-projects .wnl-v3-actions,
	.wnl-v3-projects .wnl-v3-btn-wrap {
		margin-top: 24px;
	}

	.wnl-v3-projects .wnl-v3-btn {
		width: 100%;
		min-height: 48px;
		padding: 12px 16px;
		font-size: 0.75rem;
		line-height: 1.4;
		border-radius: 999px;
	}

	/* Support plans */
	.wnl-v3-support .wnl-v3-section-head {
		margin-bottom: 24px;
		text-align: center;
	}

	.wnl-v3-support .wnl-v3-section-head h2 {
		text-align: center;
	}

	.wnl-v3-support .wnl-v3-section-head > p {
		max-width: 310px;
		margin-inline: auto;
		text-align: center;
	}

	.wnl-v3-support-grid {
		display: grid;
		grid-template-columns: 1fr;
		gap: 16px;
		margin-top: 24px;
	}

	.wnl-v3-support-card {
		min-height: 0;
		padding: 24px 16px;
		border-radius: 14px;
		box-sizing: border-box;
	}

	.wnl-v3-support-card h3 {
		min-height: 0;
		margin: 0 0 12px;
		font-size: 2rem;
		line-height: 1.12;
		letter-spacing: -.025em;
	}

	.wnl-v3-support-card__lead {
		min-height: 0;
		margin: 0 0 16px;
		font-size: 0.875rem;
		line-height: 1.78;
	}

	.wnl-v3-support-card ul {
		display: grid;
		gap: 8px;
		min-height: 0;
		margin: 16px 0 24px;
		padding-top: 16px;
	}

	.wnl-v3-support-card li {
		font-size: 0.875rem;
		line-height: 1.75;
	}

	/* ⚠ 0.75rem(11.7px)まで縮めてあったが、縮める必要は無かった。
	      実測:ボタンの中に使える幅262pxに対し、文字は16pxでも123px。倍以上あまる。
	      ここは支援の入口。小さくしない(2026-08-25)。 */
	.wnl-v3-support-card .wnl-v3-btn {
		width: 100%;
		min-height: 48px;
		padding: 12px 16px;
		font-size: 1rem;
		line-height: 1.4;
		border-radius: 999px;
	}

	/* Media and Enkanju */
	.wnl-v3-growth .wnl-v3-media,
	.wnl-v3-partners .wnl-v3-media,
	.wnl-v3-members .wnl-v3-media {
		margin-top: 24px;
	}

	.wnl-v3-media img,
	.wnl-v3-enkanju-scene {
		width: 100%;
		border-radius: 14px;
	}

	.wnl-v3-enkanju-scene {
		min-height: 390px;
	}

	/* Vertical rhythm */
	.wnl-v3-section + .wnl-v3-section {
		margin-top: 0;
	}

	.wnl-v3-project-card:last-child,
	.wnl-v3-support-card:last-child {
		margin-bottom: 0;
	}

	.wnl-v3-section-head {
		margin-bottom: 24px;
	}

	/* Astra back-to-top button */
	#ast-scroll-top,
	.ast-scroll-to-top-right {
		right: 12px;
		bottom: 14px;
		transform: scale(.9);
	}
}

/* ==================================================================
   件数が少ないときのレイアウト

   記事やプロジェクトが1〜2件しかないと、3カラムのグリッドに
   1枚だけ左端に置かれ、右側が大きく空いてしまう。
   件数に応じてカラム数を変え、1件のときは横長カードにして
   画像と文章が同じ高さで並ぶようにする。

   ※ 上のメディアクエリ群より後ろに置くこと。
      先に書くとカラム数の指定を上書きされる。
   ================================================================== */

/* --- 2件のとき:2カラム --- */
.wnl-v3-news-grid:has(> :last-child:nth-child(2)),
.wnl-v3-project-grid:has(> :last-child:nth-child(2)) {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* --- 1件のとき:1カラムいっぱいに広げる --- */
.wnl-v3-news-grid:has(> :last-child:nth-child(1)),
.wnl-v3-project-grid:has(> :last-child:nth-child(1)) {
	grid-template-columns: minmax(0, 1fr);
}

/* 1件のカードは、画像と文章を横並びにした横長にする */
.wnl-v3-news-grid:has(> :last-child:nth-child(1)) .wnl-v3-news-card,
.wnl-v3-project-grid:has(> :last-child:nth-child(1)) .wnl-v3-project-card {
	display: grid;
	grid-template-columns: minmax(0, 42%) minmax(0, 1fr);
	align-items: stretch;
}

/* 活動報告だけは画像を右に置く。
   上の Kind Leaf と下の SHOP がどちらも画像を左に置いているため、
   ここも左にすると画像が縦一列に3つ並んで単調になる。
   右へ振ることで 右→左→右→左 と交互になる */
.wnl-v3-news-grid:has(> :last-child:nth-child(1)) .wnl-v3-news-card {
	grid-template-columns: minmax(0, 1fr) minmax(0, 42%);
}

.wnl-v3-news-grid:has(> :last-child:nth-child(1)) .wnl-v3-news-card__image {
	order: 2;
}

/* 画像は文章の高さに合わせて伸ばす。
   aspect-ratio が残っていると高さが固定されるので解除する */
.wnl-v3-news-grid:has(> :last-child:nth-child(1)) .wnl-v3-news-card__image,
.wnl-v3-project-grid:has(> :last-child:nth-child(1)) .wnl-v3-project-card__image {
	height: 100%;
	min-height: 260px;
	aspect-ratio: auto;
}

/* 文章側は上下中央に置く */
.wnl-v3-news-grid:has(> :last-child:nth-child(1)) .wnl-v3-news-card__body,
.wnl-v3-project-grid:has(> :last-child:nth-child(1)) .wnl-v3-project-card__body {
	display: grid;
	align-content: center;
	padding: clamp(28px, 3.4vw, 48px);
}

@media (max-width: 767px) {
	/* スマホでは横並びにする幅が無いので縦積みに戻す */
	.wnl-v3-news-grid:has(> :last-child:nth-child(1)) .wnl-v3-news-card,
	.wnl-v3-project-grid:has(> :last-child:nth-child(1)) .wnl-v3-project-card {
		grid-template-columns: 1fr;
	}

	.wnl-v3-news-grid:has(> :last-child:nth-child(1)) .wnl-v3-news-card__image,
	.wnl-v3-project-grid:has(> :last-child:nth-child(1)) .wnl-v3-project-card__image {
		min-height: 0;
		aspect-ratio: 16 / 10;
	}

	.wnl-v3-news-grid:has(> :last-child:nth-child(1)) .wnl-v3-news-card__body,
	.wnl-v3-project-grid:has(> :last-child:nth-child(1)) .wnl-v3-project-card__body {
		padding: 24px;
	}

	/* 縦積みでは画像を先頭に戻す(左右の振り分けは横並びのときだけの話) */
	.wnl-v3-news-grid:has(> :last-child:nth-child(1)) .wnl-v3-news-card__image {
		order: 0;
	}
}

/* ==================================================================
   MISSION 01 のバランス

   見出しは全幅。その下を「文章 | 画像」の2カラムにする。
   文章だけを置くと右半分が空くため、空いた側に画像を入れて
   文章と同じ高さで揃える。

   ※ 上のメディアクエリ群より後ろに置くこと。
   ================================================================== */

.wnl-v3-mission__body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: stretch;
	gap: clamp(32px, 4vw, 64px);
	margin-top: clamp(30px, 3.4vw, 44px);
}

/* 2カラムになるので、行長の制限は列幅が担う */
.wnl-v3-mission__text {
	max-width: 100%;
	margin-top: 0;
}

.wnl-v3-mission__text .wnl-v3-text-link {
	margin-top: clamp(26px, 3vw, 36px);
}

/* 画像は文章の高さに合わせて伸ばす。
   aspect-ratio が残っていると高さが固定されるので解除する */
.wnl-v3-mission__media {
	margin-top: 0;
	height: 100%;
}

/* min-height は「文章が極端に短いとき画像が潰れる」ことだけを防ぐ保険。
   大きくすると画像側が行の高さを決めてしまい、文章と揃わなくなる */
.wnl-v3-mission__media img,
.wnl-v3-mission__media .wnl-v3-placeholder {
	height: 100%;
	min-height: 240px;
	aspect-ratio: auto;
	object-fit: cover;
}

/* 2026-09-25 本人「ここが特に見た感じのバランスが悪い」→「まだ悪い」。
   ・画像を文章の高さに合わせて切ると、犬の目が上で切れた → 画像は元の形のまま出す
   ・文章とリンクをひとかたまりにして、画像の高さの中央に置く(規則6:高さの違う2つは center)。
     リンクが画像の下端に引っぱられて、文章から離れて浮くのをやめる */
@media (min-width: 901px) {
	.wnl-v3-mission__body {
		align-items: center;
	}

	.wnl-v3-mission__media {
		height: auto;
	}

	.wnl-v3-mission__media img,
	.wnl-v3-mission__media .wnl-v3-placeholder {
		height: auto;
		min-height: 0;
		aspect-ratio: auto;
	}

	.wnl-v3-mission__text .wnl-v3-text-link {
		margin-top: 24px;
	}
}

@media (max-width: 900px) {
	/* 横に並べる幅が無くなったら縦積みに戻し、画像は横長に戻す */
	.wnl-v3-mission__body {
		grid-template-columns: minmax(0, 1fr);
		gap: clamp(28px, 5vw, 40px);
	}

	.wnl-v3-mission__media img,
	.wnl-v3-mission__media .wnl-v3-placeholder {
		height: auto;
		min-height: 0;
		aspect-ratio: 16 / 9;
	}
}

@media (max-width: 767px) {
	.wnl-v3-mission__media img,
	.wnl-v3-mission__media .wnl-v3-placeholder {
		aspect-ratio: 4 / 3;
	}
}

/* 仲間・スタッフ(/members/):5人の並び(2026-10-08)。トップと同じく、下の段の2枚を真ん中に寄せる */
.wnl-v3-member-grid {
	grid-template-columns: repeat(6, minmax(0, 1fr));
}

.wnl-v3-member-card {
	grid-column: span 2;
}

.wnl-v3-member-card:nth-child(3n + 1):nth-last-child(2) {
	grid-column: 2 / span 2;
}

a.wnl-v3-member-card {
	display: block;
	color: inherit;
	text-decoration: none;
}

a.wnl-v3-member-card:hover img {
	transform: scale(1.03);
}

.wnl-v3-member-card__image img {
	transition: transform .4s ease;
}

@media (max-width: 1024px) {
	.wnl-v3-member-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.wnl-v3-member-card,
	.wnl-v3-member-card:nth-child(3n + 1):nth-last-child(2) {
		grid-column: auto;
	}

	.wnl-v3-member-card:last-child:nth-child(odd) {
		grid-column: 1 / -1;
		justify-self: center;
		width: calc(50% - 12px);
	}
}

/* /members/ も5人を1段に(2026-10-08 本人) */
@media (min-width: 768px) {
	.wnl-v3-member-grid {
		grid-template-columns: repeat(5, minmax(0, 1fr));
		gap: 20px;
	}

	.wnl-v3-member-card,
	.wnl-v3-member-card:nth-child(3n + 1):nth-last-child(2),
	.wnl-v3-member-card:last-child:nth-child(odd) {
		grid-column: auto;
		justify-self: stretch;
		width: auto;
	}
}

/* /members/ のスマホも、トップと同じく1人1段:左に写真、右に肩書き・名前・担当(本人 10/30「2・1・2 の構図に違和感」) */
@media (max-width: 767px) {
	.wnl-v3-member-grid {
		grid-template-columns: 1fr;
		gap: 0;
	}

	.wnl-v3-member-card,
	a.wnl-v3-member-card,
	.wnl-v3-member-card:nth-child(3n + 1):nth-last-child(2),
	.wnl-v3-member-card:last-child:nth-child(odd) {
		display: grid;
		grid-column: auto;
		grid-template-columns: 104px 1fr;
		grid-template-rows: auto auto auto;
		align-content: center;
		column-gap: 20px;
		justify-self: stretch;
		width: auto;
		padding: 18px 0;
		border-top: 1px solid rgba(13, 13, 13, .14);
	}

	.wnl-v3-member-card:last-child {
		border-bottom: 1px solid rgba(13, 13, 13, .14);
	}

	.wnl-v3-member-card__image {
		grid-row: 1 / span 3;
		align-self: center;
	}

	.wnl-v3-inner .wnl-v3-member-card > p,
	.wnl-v3-member-card > p {
		align-self: end;
		margin: 0 0 2px;
	}

	.wnl-v3-member-card > div:last-child {
		align-self: start;
		margin-top: 4px;
		word-break: auto-phrase;
	}
}
