@charset "UTF-8";
/* ==========================================================================
   page-top.css ── TOP
   値は Figma の TOP（PC 543:28926／SP 537:24783）のもの。
   絵の部分（写真・飾り）は、デザイン幅に対する比率（--pw-unit／--pw-unit-sp）で置く。
   ========================================================================== */

.pw-wedge { position: absolute; left: 0; width: 100%; height: calc(126 * var(--pw-unit)); max-width: none; pointer-events: none; }
.pw-wedge--bottom { bottom: -.5px; }
.pw-wedge--top { top: 0; }

/* ---- 1. FV ---- */
.pw-fv { position: relative; background: var(--pw-color-bg); overflow: hidden; }
.pw-fv__inner {
	position: relative; max-width: 1440px; min-height: calc(900 * var(--pw-unit)); margin-inline: auto;
	padding: calc(299 * var(--pw-unit)) 0 calc(100 * var(--pw-unit)) calc(120 * var(--pw-unit));
}
.pw-fv__visual { position: absolute; left: calc(505 * var(--pw-unit)); top: calc(70 * var(--pw-unit)); width: calc(893 * var(--pw-unit)); aspect-ratio: 893 / 716; }
.pw-fv__visual .pw-boxphoto { --pw-boxphoto-mask: url(../img/fv_mask_pc.svg); }
.pw-fv__visual .pw-boxphoto__img { top: -59.497%; }
.pw-fv__deco { position: absolute; left: 0; top: 17.598%; width: 100%; height: 82.402%; max-width: none; }
.pw-fv__body { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 32px; }
.pw-fv__copy { display: flex; flex-direction: column; align-items: flex-start; }
.pw-fv__tags { display: flex; flex-wrap: wrap; gap: 0 16px; height: 32px; }
.pw-fv__tags li { display: flex; align-items: flex-start; height: 32px; padding: 4px 0; font-size: 12px; line-height: 22px; white-space: nowrap; }
.pw-fv__tags img { flex: none; width: 22px; height: 22px; }
.pw-fv__title { display: flex; flex-direction: column; margin-top: -7px; }
.pw-fv__en {
	font-family: var(--pw-font-en); font-weight: 600; font-size: 40px; line-height: 2; letter-spacing: .16em;
	color: var(--pw-color-logo); white-space: nowrap;
}
.pw-fv__ja { margin-top: -8px; font-size: 16px; line-height: 26px; letter-spacing: .04em; }
.pw-fv__buttons { display: flex; gap: 24px; }
.pw-fv__news { position: relative; width: calc(516 * var(--pw-unit)); min-width: min(351px, 100% - 24px); margin-top: calc(149 * var(--pw-unit)); }
.pw-fv__scroll { position: absolute; left: calc(1171.86 * var(--pw-unit)); top: calc(628.86 * var(--pw-unit)); width: calc(145.61 * var(--pw-unit)); aspect-ratio: 1; }
.pw-fv__scroll-ring { position: absolute; left: 2.27%; top: 2.27%; width: 95.46%; height: 95.46%; animation: pw-rotate 16s linear infinite reverse; }
.pw-fv__scroll-arrow { position: absolute; left: 53.43%; top: 50%; width: 9.615%; height: auto; translate: -50% -50%; }
@keyframes pw-rotate { to { rotate: 1turn; } }

/* FV の出現：見出しが左から開き、ほかの要素はその場でフェード（CSS だけで動く） */
@media (prefers-reduced-motion: no-preference) {
	.pw-fv__en { animation: pw-open-right .5s ease-out .1s both; }
	.pw-fv :where(.pw-fv__tags, .pw-fv__ja, .pw-fv__buttons, .pw-fv__news, .pw-fv__visual, .pw-fv__scroll) { animation: pw-fade-in 1s ease-in .6s both; }
}
@keyframes pw-open-right { from { clip-path: inset(-100% 100% -100% 0); } to { clip-path: inset(-100% 0 -100% 0); } }
@keyframes pw-fade-in { from { opacity: 0; } to { opacity: 1; } }

/* ---- 2. Concept ---- */
.pw-top-concept { position: relative; background: var(--pw-color-bg); overflow: hidden; }
.pw-top-concept__inner {
	position: relative; max-width: 1440px; min-height: calc(710 * var(--pw-unit)); margin-inline: auto;
	padding: calc(112 * var(--pw-unit)) var(--pw-gutter) calc(235 * var(--pw-unit)) calc(741.5 * var(--pw-unit));
}
.pw-top-concept__bgword {
	position: absolute; left: calc(1199 * var(--pw-unit)); top: calc(24 * var(--pw-unit));
	writing-mode: vertical-rl; rotate: 180deg; color: var(--pw-color-bg-yellowgreen); font-size: calc(96 * var(--pw-unit));
}
.pw-top-concept__photo { position: absolute; overflow: hidden; background: #D9D9D9; }
.pw-top-concept__photo img { width: 100%; height: 100%; object-fit: cover; }
.pw-top-concept__photo--large { left: calc(120 * var(--pw-unit)); top: calc(46 * var(--pw-unit)); width: calc(416 * var(--pw-unit)); aspect-ratio: 416 / 432; }
.pw-top-concept__photo--large img { object-position: 50% 45.97%; }
.pw-top-concept__photo--small { left: calc(1058 * var(--pw-unit)); top: calc(390 * var(--pw-unit)); width: calc(216 * var(--pw-unit)); aspect-ratio: 216 / 176; }
.pw-top-concept__photo--small img { object-position: 50% 0; }
.pw-top-concept__body { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.pw-top-concept__main { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
.pw-top-concept__text { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.pw-top-concept__desc { font-size: 16px; line-height: 29px; }

/* ---- 3. お悩み ---- */
.pw-top-concern { display: flex; flex-direction: column; align-items: center; gap: 80px; padding: 0 var(--pw-gutter) 40px; background: var(--pw-color-bg-green30); }
.pw-top-concern__upper { display: flex; flex-direction: column; align-items: center; gap: 24px; width: min(1152px, 100%); }
.pw-top-concern__heading { display: flex; flex-direction: column; align-items: center; width: min(775px, 100%); height: 213px; }
.pw-top-concern__bgword { color: var(--pw-color-bg-green50); align-self: stretch; }
.pw-top-concern__title { margin-top: -80px; position: relative; }
.pw-concerns { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; align-self: stretch; }
.pw-concern { display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 4px; background: var(--pw-color-white); }
.pw-concern__head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 7px; border-bottom: 1px solid var(--pw-color-border); }   /* 7＋線1＝Figma の 64 */
.pw-concern__num { font-family: var(--pw-font-en); font-weight: 500; font-size: 24px; line-height: 29px; color: var(--pw-color-primary); }
.pw-concern__body { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.pw-concern__title { align-self: stretch; font-size: 18px; font-weight: 500; line-height: 32px; min-height: 64px; }
.pw-concern__arrow { width: 12px; height: 33px; margin: -.5px 0 -.5px 2px; }
.pw-concern__text { align-self: stretch; font-size: 16px; line-height: 29px; }
.pw-top-concern__lower { display: flex; flex-direction: column; align-items: center; gap: 41px; width: min(500px, 100%); }
.pw-top-concern__dog { width: 121px; height: 248px; }
.pw-top-concern__message { display: flex; align-self: stretch; font-size: 20px; line-height: 36px; white-space: nowrap; }
.pw-top-concern__message > span { flex: none; text-align: center; }
.pw-top-concern__message > span:nth-child(1) { width: 140px; }
.pw-top-concern__message > span:nth-child(2) { width: 220px; }
.pw-top-concern__message > span:nth-child(3) { width: 160px; }

/* ---- 4. Why ---- */
.pw-top-why { position: relative; padding: calc(182 * var(--pw-unit)) 0 40px; background: var(--pw-color-bg); }
.pw-top-why__inner { display: flex; justify-content: space-between; align-items: center; gap: 24px; width: min(var(--pw-content), 100% - var(--pw-gutter) * 2); margin-inline: auto; }
.pw-top-why__heading { flex: 0 1 469px; }
.pw-top-why__heading .pw-lead { white-space: nowrap; }
.pw-whycards { display: flex; flex-direction: column; gap: 24px; flex: none; width: min(600px, 50%); }
.pw-whycard { flex: none; height: 320px; }
.pw-whycard__inner { display: flex; flex-direction: column; align-items: center; gap: 24px; height: 100%; padding: 32px 24px 24px; background: var(--pw-color-white); border: 1px solid var(--pw-color-border); }
.pw-whycard__num { align-self: flex-start; margin-left: -11.5px; padding: 0 16px; font-family: var(--pw-font-en); font-weight: 500; font-size: 24px; line-height: 29px; color: var(--pw-color-primary); }
.pw-whycard__main { display: flex; align-items: center; gap: 24px; width: 440px; max-width: 100%; }
.pw-whycard__illust { flex: none; width: 144px; height: 144px; }
.pw-whycard__text { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; flex: 1 1 0; min-width: 0; }
.pw-whycard__title { font-size: 18px; font-weight: 500; line-height: 32px; }
.pw-whycard__title .pw-marker { white-space: nowrap; }
.pw-whycard__desc { font-size: 16px; line-height: 29px; }
.pw-whycard:nth-child(2) .pw-marker::after { background-image: url(../img/marker_why_02.svg); }

/* Why のカードが重なる動き（PC・JS が動くときだけ）。JS が無ければ、カード3枚は縦に並んで全部見える */
@media (min-width: 1025px) and (prefers-reduced-motion: no-preference) {
	.pw-js .pw-top-why::after { content: ""; display: block; height: 688px; }   /* カード2枚ぶんのスクロール量。padding だと sticky が動かないので中身として足す */
	.pw-js .pw-top-why__inner { position: sticky; top: max(24px, calc(50vh - 172px)); }
	.pw-js .pw-whycards { position: relative; display: block; height: 344px; overflow: hidden; }
	.pw-js .pw-whycard { position: absolute; left: 0; top: 0; width: 100%; will-change: translate; }
	.pw-js .pw-whycard:nth-child(2) { translate: 0 calc(344px * (1 - var(--pw-why-p2, 0))); }
	.pw-js .pw-whycard:nth-child(3) { translate: 0 calc(344px * (1 - var(--pw-why-p3, 0))); }
}

/* ---- 5. Our Course ---- */
.pw-top-course { position: relative; padding: 94px var(--pw-gutter); background: var(--pw-color-bg); overflow: hidden; }
.pw-top-course__illust { position: absolute; left: calc(-83 * var(--pw-unit)); top: 0; width: calc(429 * var(--pw-unit)); height: auto; max-width: none; pointer-events: none; }
.pw-top-course__inner { position: relative; display: flex; flex-direction: column; align-items: center; gap: 40px; width: min(1074px, 100%); margin-inline: auto; }
.pw-top-course__heading { display: flex; flex-direction: column; align-items: center; align-self: stretch; }
.pw-top-course__bgword { color: var(--pw-color-bg-green10); align-self: stretch; }
.pw-top-course__title { margin-top: -80px; position: relative; }
.pw-top-course__body { display: flex; flex-direction: column; align-items: center; gap: 80px; align-self: stretch; }

/* ---- 6. お客さまの声 ---- */
.pw-top-voice { padding: 72px var(--pw-gutter); background: var(--pw-color-bg); }
.pw-top-voice__inner { display: flex; flex-direction: column; align-items: center; gap: 54px; }
.pw-top-voice__body { display: flex; flex-direction: column; align-items: center; gap: 56px; width: min(1192px, 100%); }
.pw-voices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-self: stretch; }
.pw-voice { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; min-height: 230px; padding-bottom: 16px; background: var(--pw-color-white); }
.pw-voice__tag { display: flex; }
.pw-voice__tag span { padding: 0 16px; font-size: 16px; line-height: 1.5; color: var(--pw-color-white); background: var(--pw-color-primary); }
.pw-voice__main { display: flex; align-items: center; gap: 31px; align-self: stretch; padding: 0 16px 0 32px; }
.pw-voice__who { display: flex; flex-direction: column; align-items: center; flex: none; width: 158px; }
.pw-voice__who img { width: 158px; height: 150px; }
.pw-voice__who figcaption { font-size: 12px; line-height: 22px; text-align: center; white-space: nowrap; }
.pw-voice__text { display: flex; flex-direction: column; flex: 1 1 0; min-width: 0; min-height: 172px; }
.pw-voice__comment { font-size: 16px; line-height: 29px; }
.pw-voice__comment em { color: var(--pw-color-primary); }
.pw-voice__note { font-size: 12px; line-height: 22px; color: var(--pw-color-caption); }

/* ---- 8. Gallery ---- */
.pw-top-gallery { position: relative; background: var(--pw-color-bg-green10); overflow: hidden; }
.pw-top-gallery__inner { position: relative; max-width: 1440px; min-height: calc(676 * var(--pw-unit)); margin-inline: auto; padding: calc(174 * var(--pw-unit)) 0 calc(144 * var(--pw-unit)) calc(120 * var(--pw-unit)); }
.pw-top-gallery__body { position: relative; display: flex; flex-direction: column; align-items: stretch; gap: 56px; width: 307px; }
.pw-top-gallery__heading .pw-lead { white-space: nowrap; }
.pw-top-gallery__photos { position: absolute; left: calc(720 * var(--pw-unit)); top: 0; bottom: 0; width: calc(671 * var(--pw-unit)); }
/* 写真が0件のとき（[pw_gallery_loop] が空）はトップのギャラリー欄ごと出さない。写真を登録すれば自動で出る（2026-10-08） */
.pw-top-gallery:has(.pw-top-gallery__photos:empty) { display: none; }
.pw-galleryloop { position: absolute; inset: 0; display: flex; justify-content: space-between; --pw-gallery-size: calc(324 * var(--pw-unit)); --pw-gallery-gap: calc(16 * var(--pw-unit)); }
.pw-galleryloop__col { position: relative; flex: none; width: var(--pw-gallery-size); }
.pw-galleryloop__col--up { top: calc(-90 * var(--pw-unit)); }
.pw-galleryloop__col--down { top: calc(-240 * var(--pw-unit)); }
.pw-galleryloop__list { display: flex; flex-direction: column; gap: var(--pw-gallery-gap); margin-bottom: var(--pw-gallery-gap); }
.pw-galleryloop__item { flex: none; width: var(--pw-gallery-size); aspect-ratio: 1; overflow: hidden; background: #D9D9D9; }
.pw-galleryloop__img { width: 100%; height: 100%; object-fit: cover; }
/* 同じ並びを JS がもう1本足し、1本ぶん（高さ＋間隔）を動かして途切れなくつなぐ */
.pw-galleryloop.is-loop .pw-galleryloop__col--up .pw-galleryloop__list { animation: pw-gallery-up 30s linear infinite; }
.pw-galleryloop.is-loop .pw-galleryloop__col--down .pw-galleryloop__list { animation: pw-gallery-up 30s linear infinite reverse; }
@keyframes pw-gallery-up { to { translate: 0 calc(-100% - var(--pw-gallery-gap)); } }

/* ---- 9. Blog & News ---- */
.pw-top-blog { padding: 72px var(--pw-gutter); background: var(--pw-color-bg); }
.pw-top-blog__inner { display: flex; flex-direction: column; align-items: center; gap: 56px; }
.pw-top-blog__body { display: flex; flex-direction: column; align-items: center; gap: 72px; width: min(var(--pw-content), 100%); }
.pw-top-blog__body .pw-blogcards { align-self: stretch; }

/* ==========================================================================
   PC より狭い幅（1024px 以下）で共通の組み替え。SP はこのあとの SP のブロックでさらに上書きする
   ========================================================================== */
@media (max-width: 1024px) {
	.pw-top-concern__heading { height: auto; }
	.pw-concerns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pw-top-why__inner { flex-direction: column; align-items: stretch; gap: 48px; }
	.pw-top-why__heading { flex: none; }
	.pw-whycards { width: 100%; }
	.pw-whycard { height: auto; }
	.pw-whycard__num { margin-left: 0; }
	.pw-voices { grid-template-columns: minmax(0, 1fr); }
}

/* ==========================================================================
   タブレット（768〜1024px）：PC のデザインを縮める。デザインが無いので実装の判断（提出時に確認）
   ========================================================================== */
@media (min-width: 768px) and (max-width: 1024px) {
	/* FV：写真を右半分に寄せ、文字と重なる幅を PC と同程度にする */
	.pw-fv__inner { padding-left: var(--pw-gutter); }
	.pw-fv__visual { left: 48%; top: 80px; width: 52%; }
	.pw-fv__en { font-size: clamp(24px, calc(40 * var(--pw-unit)), 40px); }
	.pw-fv__ja { font-size: 15px; }
	.pw-fv__news { width: min(516px, 48%); margin-top: 80px; }
	.pw-fv__scroll { left: auto; right: 6%; top: auto; bottom: 90px; width: 110px; }
	/* Concept：小さい写真を右下に置き、本文と重ねない */
	.pw-top-concept__inner { padding: calc(112 * var(--pw-unit)) calc(160 * var(--pw-unit)) calc(235 * var(--pw-unit)) calc(600 * var(--pw-unit)); }
	.pw-top-concept__photo--small { left: auto; right: var(--pw-gutter); top: auto; bottom: calc(80 * var(--pw-unit)); }
	.pw-top-concept__bgword { left: auto; right: 0; }
	.pw-bgword { font-size: calc(96 * var(--pw-unit)); line-height: 1.8; }
	.pw-top-concern__title, .pw-top-course__title { margin-top: calc(-80 * var(--pw-unit)); }
}

/* ==========================================================================
   SP（767px 以下）
   ========================================================================== */
@media (max-width: 767px) {
	.pw-wedge { height: calc(48 * var(--pw-unit-sp)); }

	/* 1. FV */
	.pw-fv__inner { max-width: 500px; min-height: calc(779 * var(--pw-unit-sp)); padding: 56px 0 56px 20px; }
	.pw-fv__visual { left: calc(12 * var(--pw-unit-sp)); top: calc(204 * var(--pw-unit-sp)); width: calc(420 * var(--pw-unit-sp)); aspect-ratio: 420 / 336.75; }
	.pw-fv__visual .pw-boxphoto { --pw-boxphoto-mask: url(../img/fv_mask_sp.svg); }
	.pw-fv__visual .pw-boxphoto__img { left: -.952%; width: 87.381%; top: -51.67%; }
	.pw-fv__deco { top: 17.598%; height: 82.402%; }
	.pw-fv__body { gap: 0; }
	.pw-fv__buttons { display: none; }
	.pw-fv__en { font-size: 24px; }
	.pw-fv__ja { margin-top: 0; font-size: 14px; line-height: 22px; letter-spacing: .16em; }
	.pw-fv__news { width: calc(351 * var(--pw-unit-sp)); min-width: 0; margin: calc(443 * var(--pw-unit-sp)) 0 0 -8px; }
	.pw-fv__scroll { left: calc(238 * var(--pw-unit-sp)); top: calc(478 * var(--pw-unit-sp)); width: calc(124.61 * var(--pw-unit-sp)); }
	.pw-fv__scroll-ring { left: 3.83%; top: 3.83%; width: 92.34%; height: 92.34%; }
	.pw-fv__scroll-arrow { left: 54.41%; top: 50.4%; width: 11.235%; }

	/* 2. Concept */
	.pw-top-concept__inner { max-width: 500px; min-height: calc(978 * var(--pw-unit-sp)); padding: 0 20px calc(637 * var(--pw-unit-sp)); }
	.pw-top-concept__bgword { left: calc(305 * var(--pw-unit-sp)); top: 120px; font-size: 40px; line-height: 72px; }
	.pw-top-concept__photo--large { left: 0; top: auto; bottom: calc(262 * var(--pw-unit-sp)); width: calc(256 * var(--pw-unit-sp)); aspect-ratio: 256 / 266; }
	.pw-top-concept__photo--large img { position: absolute; left: 0; top: -21.43%; width: 105.47%; height: 135.34%; max-width: none; }   /* Figma の画像枠 270×360 を 256×266 の窓で */
	.pw-top-concept__photo--small { left: auto; right: 0; top: auto; bottom: calc(88 * var(--pw-unit-sp)); width: calc(168 * var(--pw-unit-sp)); aspect-ratio: 168 / 137; }
	.pw-top-concept__photo--small img { object-position: 100% 47.37%; }
	.pw-top-concept__body { gap: 24px; }
	.pw-top-concept__body > .pw-eyebrow { margin-bottom: 0; }

	/* 3. お悩み */
	.pw-top-concern { gap: 48px; padding: 40px 0; }
	.pw-top-concern__upper { gap: 48px; width: 100%; }
	.pw-top-concern__heading { width: min(363px, 100%); height: auto; }
	.pw-top-concern__title { margin-top: -32px; gap: 4px; }
	.pw-concerns { grid-template-columns: minmax(0, 1fr); gap: 24px; align-self: center; width: min(335px, 100% - 40px); }
	.pw-concern__title { min-height: 0; }
	.pw-top-concern__lower { gap: 8px; width: min(343px, 100% - 32px); }
	.pw-top-concern__dog { width: 81px; height: 166.02px; }
	.pw-top-concern__message { flex-direction: column; align-items: center; }
	.pw-top-concern__message > span:nth-child(n) { width: auto; }
	.pw-top-concern__message .pw-marker--concern::after { left: -10px; right: -10px; }   /* SP は文字（200）より線（220）が広い。PC は枠 220 に線 220 */

	/* 4. Why */
	.pw-top-why { padding: 0 0 32px; }
	.pw-top-why .pw-wedge { position: relative; display: block; }
	.pw-top-why__inner { gap: 48px; width: 100%; margin-top: 48px; align-items: center; }
	.pw-top-why__heading { width: min(343px, 100% - 32px); }
	.pw-top-why__heading .pw-lead { white-space: normal; }
	.pw-whycards { width: min(352px, 100% - 23px); gap: 24px; }
	.pw-whycard { min-height: 0; }
	.pw-whycard__inner { align-items: stretch; gap: 8px; padding: 24px 16px; border: 0; }
	.pw-whycard__num { align-self: stretch; margin-left: 0; }
	.pw-whycard__main { flex-direction: column; justify-content: center; gap: 24px; width: 100%; }
	.pw-whycard__text { align-items: center; align-self: stretch; flex: none; }
	.pw-whycard__desc { align-self: stretch; }

	/* 5. Our Course */
	.pw-top-course { padding: 32px 20px; }
	.pw-top-course__illust { display: none; }
	.pw-top-course__inner { gap: 59px; width: min(335px, 100%); }
	.pw-top-course__bgword { color: var(--pw-color-bg-green50); }
	.pw-top-course__title { margin-top: -32px; gap: 4px; align-items: stretch; }
	.pw-top-course__title .pw-lead { text-align: left; }
	.pw-top-course__body { gap: 40px; }

	/* 6. お客さまの声 */
	.pw-top-voice { padding: 32px 12px; }
	.pw-top-voice__inner { gap: 32px; }
	.pw-top-voice__heading { width: min(343px, 100% - 8px); margin-inline: auto; gap: 16px; }   /* 左右中央（Figma SP は左 20・右 12 で 4px 右寄りだが、390・430px の実機で見出しが右に寄るので中央に。2026-10-01 指摘） */
	.pw-top-voice__heading.pw-heading--center { align-items: stretch; }
	.pw-top-voice__heading .pw-lead { text-align: left; }
	.pw-top-voice__body { width: min(351px, 100%); }
	.pw-voices { gap: 24px; }
	.pw-voice { gap: 0; min-height: 0; }
	.pw-voice__main { flex-direction: column; justify-content: center; gap: 16px; padding: 0 16px; }
	.pw-voice__text { flex: none; align-self: stretch; min-height: 172px; }

	/* 8. Gallery */
	.pw-top-gallery__inner { display: flex; flex-direction: column; align-items: center; gap: 32px; max-width: 500px; min-height: 0; padding: 48px 12px; }
	.pw-top-gallery__body { display: contents; }
	.pw-top-gallery__heading { order: 1; width: min(335px, 100% - 16px); }
	.pw-top-gallery__photos { order: 2; position: relative; left: auto; top: auto; bottom: auto; width: min(351px, 100%); height: 490px; overflow: hidden; }
	.pw-top-gallery__btn { order: 3; }
	.pw-galleryloop { --pw-gallery-size: 172px; --pw-gallery-gap: 8px; }
	.pw-galleryloop__col--up { top: 0; }
	.pw-galleryloop__col--down { top: -42px; }

	/* 9. Blog & News */
	.pw-top-blog { padding: 48px 20px; }
	.pw-top-blog__inner { gap: 32px; }
	.pw-top-blog__heading { width: min(335px, 100%); gap: 16px; }
	.pw-top-blog__heading.pw-heading--center { align-items: stretch; }
	.pw-top-blog__heading .pw-lead { text-align: left; }
	.pw-top-blog__body { gap: 48px; align-items: flex-start; width: min(335px, 100%); }
}