/*
Theme Name: navian
Theme URI: https://www.navian.co.jp/
Author: Navian Inc.
Description: 有限会社ナビアン コーポレートサイト用テーマ。日本語／英語の独立ページツリーと、レポート用カスタム投稿タイプ（report / report_en）を持つ。
Version: 0.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: navian
*/

/* ==========================================================================
   1. ベース
   ========================================================================== */
:root {
	--nv-text: #333;
	--nv-text-sub: #666;
	--nv-line: #ddd;
	--nv-accent: #0a3583;   /* Navianロゴの濃紺（実測値） */
	--nv-label: #e00000;    /* 表紙に重ねる可変文字（Q4 2024 等）の赤 */
	--nv-bg: #fff;
	--nv-bg-sub: #f5f6f8;
	--nv-wrap: 1000px;
}

*, *::before, *::after { box-sizing: border-box; }

body {
	margin: 0;
	background: var(--nv-bg);
	color: var(--nv-text);
	font-family: "Helvetica Neue", Arial, "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
	font-size: 15px;
	line-height: 1.8;
}

img { max-width: 100%; height: auto; vertical-align: middle; }
a { color: var(--nv-accent); }
a:hover { opacity: .75; }

.nv-wrap {
	max-width: var(--nv-wrap);
	margin: 0 auto;
	padding: 0 20px;
}

/* ==========================================================================
   2. ヘッダー
   ========================================================================== */
.nv-header {
	border-bottom: 1px solid var(--nv-line);
	background: var(--nv-bg);
}

.nv-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	padding-top: 18px;
	padding-bottom: 18px;
}

.nv-logo img { max-height: 46px; width: auto; }
.nv-logo__text {
	font-size: 20px;
	font-weight: bold;
	color: var(--nv-accent);
	text-decoration: none;
	letter-spacing: .04em;
}

/* 言語切替（現行Jimdoと同じくヘッダー右上） */
.nv-langswitch {
	display: flex;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 13px;
}
.nv-langswitch li + li { border-left: 1px solid var(--nv-line); }
.nv-langswitch a {
	display: block;
	padding: 2px 12px;
	color: var(--nv-text-sub);
	text-decoration: none;
}
.nv-langswitch .is-current a {
	color: var(--nv-accent);
	font-weight: bold;
}

/* グローバルナビ */
.nv-gnav {
	border-top: 1px solid var(--nv-line);
	background: var(--nv-bg);
}
.nv-gnav ul {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	margin: 0;
	padding: 0;
}
.nv-gnav li { position: relative; }
.nv-gnav a {
	display: block;
	padding: 12px 18px;
	color: var(--nv-text);
	font-size: 14px;
	text-decoration: none;
}
.nv-gnav a:hover,
.nv-gnav .current-menu-item > a,
.nv-gnav .current_page_item > a {
	color: var(--nv-accent);
	box-shadow: inset 0 -3px 0 var(--nv-accent);
	opacity: 1;
}
/* 子メニュー */
.nv-gnav .sub-menu {
	display: none;
	position: absolute;
	z-index: 10;
	min-width: 220px;
	border: 1px solid var(--nv-line);
	background: #fff;
}
.nv-gnav li:hover > .sub-menu,
.nv-gnav li:focus-within > .sub-menu { display: block; }
.nv-gnav .sub-menu a { padding: 10px 16px; }

/* SP */
.nv-navtoggle { display: none; }
@media (max-width: 767px) {
	.nv-navtoggle {
		display: block;
		border: 1px solid var(--nv-line);
		background: #fff;
		padding: 8px 12px;
		font-size: 13px;
		cursor: pointer;
	}
	.nv-gnav ul { display: none; flex-direction: column; }
	.nv-gnav.is-open ul { display: flex; }
	.nv-gnav li + li { border-top: 1px solid var(--nv-line); }
	.nv-gnav .sub-menu { position: static; display: block; border: 0; }
	.nv-gnav .sub-menu a { padding-left: 34px; }
}

/* ==========================================================================
   3. パンくず・ページ見出し
   ========================================================================== */
.nv-breadcrumb {
	padding-top: 14px;
	font-size: 12px;
	color: var(--nv-text-sub);
}
.nv-breadcrumb a { color: var(--nv-text-sub); }

.nv-pagetitle {
	margin: 8px 0 30px;
	font-size: 15px;
	font-weight: bold;
}

.nv-section { margin: 0 0 56px; }
.nv-section__title {
	margin: 0 0 4px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--nv-line);
	font-size: 22px;
	font-weight: normal;
	letter-spacing: .02em;
}

/* ==========================================================================
   4. レポートカード（トップの New Report 3枚並び）
   ========================================================================== */
.nv-reportlist {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
	margin-top: 28px;
}
@media (max-width: 767px) {
	.nv-reportlist { grid-template-columns: 1fr; }
}

.nv-reportcard { text-align: center; }
.nv-reportcard a { text-decoration: none; color: inherit; display: block; }
/* カードの枠。中身（比率・重ね文字）は .nv-cover 側が持つ */
.nv-reportcard__thumb {
	border: 1px solid var(--nv-line);
	line-height: 0;
}
.nv-reportcard__title {
	margin: 12px 0 0;
	font-size: 15px;
	font-weight: bold;
	line-height: 1.6;
}
.nv-reportcard__badge {
	display: inline-block;
	margin-top: 8px;
	padding: 2px 8px;
	background: #c00;
	color: #fff;
	font-size: 11px;
	font-weight: bold;
	letter-spacing: .08em;
}
.nv-reportcard__date {
	margin: 6px 0 0;
	font-size: 12px;
	color: var(--nv-text-sub);
}

/* --------------------------------------------------------------------------
   表紙に重ねる可変文字（画像に焼き込まない）
   ベース画像はメディアに1度上げて使い回し、号数や年次だけをここで重ねる。
   -------------------------------------------------------------------------- */
.nv-cover {
	position: relative;
	overflow: hidden;
	background: var(--nv-bg-sub);
	aspect-ratio: 3 / 2;
}
.nv-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }

.nv-cover { container-type: inline-size; }
.nv-cover__noimg { position: absolute; inset: 0; display: grid; place-items: center; color: #999; font-size: 12px; }

/* 透かし */
.nv-cover__mark {
	position: absolute;
	bottom: 8%;
	width: 26cqw;
	height: auto;
	opacity: .5;
	filter: brightness(0) invert(1) drop-shadow(0 0 2px rgba(0,0,0,.35));
	pointer-events: none;
}
.nv-cover__mark.is-left  { left: 2%; }
.nv-cover__mark.is-right { right: 2%; }

/* 白いタイトル */
.nv-cover__title {
	position: absolute;
	margin: 0;
	color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: clamp(13px, 6cqw, 34px);
	line-height: 1.3;
	letter-spacing: .06em;
	white-space: pre-line;
	text-shadow: 0 2px 8px rgba(0,0,0,.55), 0 0 2px rgba(0,0,0,.5);
}
.nv-cover__title.is-bottom { left: 0; right: 0; bottom: 5%; text-align: center; padding: 0 3%; }
.nv-cover__title.is-top    { left: 0; right: 0; top: 5%;    text-align: center; padding: 0 3%; }
.nv-cover__title.is-tl     { left: 3%; top: 5%; }
.nv-cover__title.is-bl     { left: 3%; bottom: 5%; }

/* 赤い号数 */
.nv-cover__label {
	position: absolute;
	margin: 0;
	color: var(--nv-label);
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: clamp(12px, 5cqw, 28px);
	line-height: 1.25;
	letter-spacing: .02em;
	white-space: pre-line;
	text-shadow: 0 0 6px rgba(255,255,255,.9), 0 0 2px rgba(255,255,255,.9);
}
.nv-cover__label.is-tl { top: 12%;  left: 3%; }
.nv-cover__label.is-tr { top: 12%;  right: 3%; text-align: right; }
.nv-cover__label.is-bl { bottom: 6%; left: 3%; }
.nv-cover__label.is-br { bottom: 6%; right: 3%; text-align: right; }

/* --------------------------------------------------------------------------
   ヒーロー（トップの背景切り替え帯）
   -------------------------------------------------------------------------- */
.nv-hero {
	position: relative;
	margin-bottom: 44px;
	aspect-ratio: 16 / 6;
	min-height: 220px;
	overflow: hidden;
	background: #06183c;
	container-type: inline-size;
}
@media (max-width: 767px) {
	.nv-hero { aspect-ratio: 4 / 3; }
}
.nv-hero__image {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
}
.nv-hero__mark {
	position: absolute;
	left: 4%;
	top: 50%;
	transform: translateY(-50%);
	width: 14cqw;
	min-width: 90px;
	opacity: .38;
	filter: brightness(0) invert(1);
	pointer-events: none;
}


/* ==========================================================================
   5. ニュース一覧
   ========================================================================== */
.nv-newslist { list-style: none; margin: 24px 0 0; padding: 0; }
.nv-newslist li {
	padding: 16px 0;
	border-bottom: 1px dotted var(--nv-line);
}
.nv-newslist time {
	display: inline-block;
	min-width: 100px;
	color: var(--nv-text-sub);
	font-size: 13px;
}
.nv-newslist a { text-decoration: none; }
.nv-newslist a:hover { text-decoration: underline; }
.nv-more { margin-top: 20px; text-align: right; font-size: 13px; }

/* ==========================================================================
   6. レポート詳細
   ========================================================================== */
.nv-report__head {
	display: grid;
	grid-template-columns: 300px 1fr;
	gap: 36px;
	margin-bottom: 40px;
}
@media (max-width: 767px) {
	.nv-report__head { grid-template-columns: 1fr; }
}
.nv-report__cover img { width: 100%; border: 1px solid var(--nv-line); }

.nv-spec { width: 100%; border-collapse: collapse; font-size: 14px; }
.nv-spec th, .nv-spec td {
	padding: 10px 12px;
	border: 1px solid var(--nv-line);
	text-align: left;
	vertical-align: top;
}
.nv-spec th {
	width: 32%;
	background: var(--nv-bg-sub);
	font-weight: normal;
	white-space: nowrap;
}

.nv-dl {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 16px;
	padding: 10px 18px;
	border: 1px solid var(--nv-accent);
	color: var(--nv-accent);
	font-size: 14px;
	text-decoration: none;
}
.nv-dl:hover { background: var(--nv-accent); color: #fff; opacity: 1; }

.nv-contactbox {
	margin-top: 40px;
	padding: 20px 24px;
	background: var(--nv-bg-sub);
	border-left: 4px solid var(--nv-accent);
	font-size: 14px;
}
.nv-contactbox p { margin: 0 0 4px; }

/* 本文（固定ページ・ニュース） */
.nv-entry h2 {
	margin: 40px 0 14px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--nv-line);
	font-size: 19px;
}
.nv-entry h3 { margin: 30px 0 10px; font-size: 16px; }
.nv-entry p { margin: 0 0 1.2em; }
.nv-entry table { width: 100%; border-collapse: collapse; font-size: 14px; margin: 0 0 1.4em; }
.nv-entry th, .nv-entry td { padding: 10px 12px; border: 1px solid var(--nv-line); text-align: left; vertical-align: top; }
.nv-entry th { background: var(--nv-bg-sub); font-weight: normal; white-space: nowrap; }

/* ==========================================================================
   7. フッター
   ========================================================================== */
.nv-footer {
	margin-top: 60px;
	padding: 28px 0;
	border-top: 1px solid var(--nv-line);
	background: var(--nv-bg-sub);
	font-size: 12px;
	color: var(--nv-text-sub);
}
.nv-footer__nav {
	display: flex;
	flex-wrap: wrap;
	gap: 0 14px;
	list-style: none;
	margin: 0 0 10px;
	padding: 0;
}
.nv-footer__nav a { color: var(--nv-text-sub); text-decoration: none; }
.nv-footer__copy { margin: 0; }