/*
 * 空庭 - Soraniwa デザインCSS（SaasLauncher子テーマ）
 * BBC.comのニュースレイアウトを空庭ブランド（空色×若葉色）で再構成
 */

/* ------------------------------------------------
 * ヘッダー
 * ---------------------------------------------- */
.sora-header .wp-block-site-logo img {
	border-radius: 10px;
	object-fit: cover;
}
.sora-header__tagline {
	letter-spacing: 0.02em;
}
/* 検索窓（ピル型・フォーカスリング付き） */
.sora-header__search .wp-block-search__inside-wrapper {
	border: 1px solid var(--wp--preset--color--border-color);
	background: var(--wp--preset--color--background-alt);
	border-radius: 999px;
	padding: 3px 4px 3px 16px;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.sora-header__search .wp-block-search__inside-wrapper:focus-within {
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 3px rgba(61, 139, 212, 0.18);
	background: var(--wp--preset--color--background);
}
.sora-header__search .wp-block-search__input {
	border: none;
	background: transparent;
	font-size: 14px;
	padding: 8px 4px;
	outline: none;
}
.sora-header__search .wp-block-search__button {
	background: var(--wp--preset--color--primary);
	border: none;
	color: #fff;
	border-radius: 999px;
	padding: 8px 14px;
	margin-left: 6px;
	cursor: pointer;
	transition: background 0.2s ease;
}
.sora-header__search .wp-block-search__button:hover {
	background: var(--wp--preset--color--secondary-shade-1);
}
.sora-header__search .wp-block-search__button svg {
	fill: #fff;
}

/* スマホ: 右上ハンバーガー＋全幅検索 */
@media (max-width: 781px) {
	.sora-header {
		position: relative;
	}
	.sora-header__bar {
		justify-content: flex-start !important;
	}
	.sora-header__search {
		order: 3;
		width: 100% !important;
	}
	.sora-header__cta {
		display: none;
	}
	.sora-header__nav {
		border-top: none !important;
		border-bottom: none !important;
		padding: 0 !important;
	}
}
/* ナビブロックは600px以下でハンバーガーに切替わる（WP標準）→ 右上に固定 */
.sora-nav .wp-block-navigation__responsive-container-open {
	color: var(--wp--preset--color--heading-color);
}
@media (max-width: 599px) {
	.sora-nav .wp-block-navigation__responsive-container-open {
		position: absolute;
		top: 24px;
		right: 14px;
		padding: 8px;
	}
	.sora-nav .wp-block-navigation__responsive-container-open svg {
		width: 30px;
		height: 30px;
	}
	/* 開いたオーバーレイのメニュー項目を大きくタップしやすく */
	.sora-nav .wp-block-navigation__responsive-container.is-menu-open {
		padding-top: 64px;
	}
	.sora-nav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
		padding: 14px 10px;
		font-size: 17px;
		border-bottom: 1px solid var(--wp--preset--color--border-color);
		width: 100%;
	}
}
.sora-nav .wp-block-navigation-item__content {
	padding: 10px 14px;
	position: relative;
}
.sora-nav .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--primary);
}
.sora-nav .current-menu-item > .wp-block-navigation-item__content::after {
	content: "";
	position: absolute;
	left: 14px;
	right: 14px;
	bottom: 0;
	height: 3px;
	background: var(--wp--preset--color--primary);
}

/* ------------------------------------------------
 * 記事カード（BBC風フラット）
 * ---------------------------------------------- */
.sora-card {
	background: transparent;
}
.sora-card .wp-block-post-featured-image img {
	display: block;
	transition: opacity 0.2s ease;
}
.sora-card .wp-block-post-featured-image a:hover img {
	opacity: 0.85;
}
.sora-card__title a {
	text-decoration: none;
	color: var(--wp--preset--color--heading-color);
}
.sora-card__title a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
	color: var(--wp--preset--color--heading-color);
}
.sora-card--dark .sora-card__title a {
	color: var(--wp--preset--color--light-color);
}
.sora-card--dark .sora-card__title a:hover {
	color: var(--wp--preset--color--light-color);
}
.sora-card__excerpt p {
	margin: 0;
}
.sora-card__meta {
	gap: 10px !important;
}
.sora-card__meta > * + *::before {
	content: "";
	display: inline-block;
	width: 1px;
	height: 11px;
	background: var(--wp--preset--color--border-color);
	margin-right: 10px;
	vertical-align: -1px;
}
.sora-card__terms a {
	color: var(--wp--preset--color--meta-color);
	text-decoration: none;
}
.sora-card__terms a:hover {
	color: var(--wp--preset--color--primary);
}

/* リード左カラム：記事間の罫線（BBC風） */
.sora-lead__side .sora-card--side {
	border-bottom: 1px solid var(--wp--preset--color--border-color);
	margin-bottom: 18px;
}
.sora-lead__side li:last-child .sora-card--side {
	border-bottom: none;
	margin-bottom: 0;
}

/* ------------------------------------------------
 * D4Uバナー / YouTube埋め込み
 * ---------------------------------------------- */
.sora-banner__row {
	gap: 16px 24px;
}
.sora-banner__left {
	gap: 16px;
}
.sora-banner__imglink {
	display: block;
	flex-shrink: 0;
}
.sora-banner__imglink img {
	display: block;
	width: 64px;
	height: 64px;
	object-fit: cover;
	border-radius: 8px;
	transition: opacity 0.2s ease;
}
.sora-banner__kicker,
.sora-banner .wp-block-heading,
.sora-banner__desc {
	margin: 0;
}
@media (max-width: 781px) {
	.sora-banner__desc {
		display: none;
	}
	.sora-banner__cta {
		width: 100%;
	}
	.sora-banner__cta .wp-block-button,
	.sora-banner__cta .wp-block-button__link {
		width: 100%;
		text-align: center;
	}
}
.sora-banner__imglink:hover img {
	opacity: 0.88;
}
.sora-youtube {
	position: relative;
	aspect-ratio: 16 / 9;
	background: var(--wp--preset--color--dark-shade);
	border-radius: 6px;
	overflow: hidden;
}
.sora-youtube iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* ------------------------------------------------
 * セクション見出し
 * ---------------------------------------------- */
.sora-section__en {
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.18em;
	color: var(--wp--preset--color--meta-color);
	margin-left: 12px;
	vertical-align: 2px;
}
.sora-section--dark .sora-section__en {
	color: var(--wp--preset--color--foreground-alt);
}

/* カテゴリーバッジ（リード・記事ページ） */
.sora-badge a {
	color: var(--wp--preset--color--primary);
	text-decoration: none;
}
.sora-badge a:hover {
	color: var(--wp--preset--color--secondary-shade-1);
	text-decoration: underline;
}

/* ------------------------------------------------
 * 記事本文（BBC風の読みやすさ）
 * ---------------------------------------------- */
.sora-article .wp-block-post-content h2 {
	font-size: 26px;
	font-weight: 900;
	border-top: 2px solid var(--wp--preset--color--heading-color);
	padding-top: 14px;
	margin-top: 2.2em;
	margin-bottom: 0.9em;
}
.sora-article .wp-block-post-content h3 {
	font-size: 20px;
	font-weight: 700;
	border-left: 4px solid var(--wp--preset--color--primary);
	padding-left: 12px;
	margin-top: 1.8em;
	margin-bottom: 0.8em;
}
.sora-article .wp-block-post-content p {
	line-height: 2;
}
.sora-article .wp-block-post-content blockquote {
	border-left: 4px solid var(--wp--preset--color--secondary);
	background: var(--wp--preset--color--background-alt);
	padding: 18px 22px;
	margin: 1.6em 0;
	color: var(--wp--preset--color--meta-color);
}

/* 前後記事ナビ */
.sora-article__nav a {
	text-decoration: none;
	color: var(--wp--preset--color--heading-color);
}
.sora-article__nav a:hover {
	color: var(--wp--preset--color--primary);
}

/* ------------------------------------------------
 * 固定ページ
 * ---------------------------------------------- */
.sora-page .wp-block-post-content h2 {
	font-size: 24px;
	font-weight: 900;
	border-top: 2px solid var(--wp--preset--color--heading-color);
	padding-top: 12px;
	margin-top: 2em;
}

/* ------------------------------------------------
 * ページネーション
 * ---------------------------------------------- */
.sora-pagination a,
.sora-pagination .page-numbers {
	text-decoration: none;
	font-weight: 700;
	font-size: 14px;
}
.sora-pagination .page-numbers.current {
	color: var(--wp--preset--color--primary);
}

/* ------------------------------------------------
 * フッター
 * ---------------------------------------------- */
.sora-footer__list {
	list-style: none;
	padding-left: 0;
}
.sora-footer__list li {
	padding: 4px 0;
}
.sora-footer__list a {
	text-decoration: none;
}
.sora-footer .wp-block-categories {
	list-style: none;
	padding-left: 0;
	font-size: 14px;
}
.sora-footer .wp-block-categories li {
	padding: 4px 0;
}
.sora-footer .wp-block-categories a {
	text-decoration: none;
	color: var(--wp--preset--color--foreground-alt);
}
.sora-footer .wp-block-categories a:hover {
	color: var(--wp--preset--color--primary);
}

/* ------------------------------------------------
 * レスポンシブ微調整
 * ---------------------------------------------- */
@media (max-width: 781px) {
	.sora-header__bar {
		justify-content: center !important;
	}
	.sora-card--lead .sora-card__title,
	.sora-card--lead h2 {
		font-size: 24px !important;
	}
}