/* =========================================================
   AST theme — 共通スタイル（リセット / 変数 / ヘッダー / フッター / ヒーロー映像）
   ページ固有のセクションスタイルは page-top.css / page-recruit.css に分離。
   ========================================================= */

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

:root {
	--header-height: 80px;
	/* ブランド原色（決定稿） */
	--red: #E60012;
	--blue: #009DE4;
	--yellow: #FBBF24;       /* 既定の黄（recruit系）。TOPは page-top.css で #FFD500 に上書き */
	--navy: #1A2744;
	--navy-deep: #0F1A30;
	--dark: #1E293B;
	/* アクセント（決定稿のブランド原色に統一：teal=青 / coral=赤） */
	--teal: #009DE4;
	--teal-mid: #0086C3;
	--teal-pale: #E3F6FF;
	--teal-light: #CFEFFF;
	--coral: #E60012;
	--coral-pale: #FFECEE;
	--green: #10B981;
	--green-pale: #ECFDF5;
	/* ニュートラル */
	--white: #FFFFFF;
	--off-white: #F8FAFC;
	--offwhite: #FAFBFC;
	--gray: #64748B;
	--line: #E2E8F0;
	--gray-100: #F1F5F9;
	--gray-200: #E2E8F0;
	--gray-300: #CBD5E1;
	--gray-400: #94A3B8;
	--gray-500: #64748B;
	--gray-600: #475569;
	--gray-700: #334155;
	--gray-900: #0F172A;

	/* タイポグラフィ：16px基準の意味別トークン */
	--font-body: 1rem;
	--font-lead: 1rem;
	--font-lead-compact: .97rem;
	--font-body-sm: .88rem;
	--font-body-card: .86rem;
	--font-body-xs: .8rem;
	--font-ui: .92rem;
	--font-ui-sm: .82rem;
	--font-caption: .78rem;
	--font-nav: .86rem;
	--font-footer-meta: .74rem;
	--font-label: .7rem;
	--font-label-lg: .72rem;
	--font-badge: .7rem;
	--font-button-sm: .85rem;
	--font-button: .92rem;
	--font-button-lg: 1rem;
	--font-card-title-sm: 1.05rem;
	--font-card-title-compact: 1.1rem;
	--font-card-title: 1.15rem;
	--font-section-title: clamp(1.8rem, 3.5vw, 2.8rem);
	--font-hero-title: clamp(2.45rem, 4.2vw, 3.8rem);
	--lh-tight: 1;
	--lh-heading: 1.2;
	--lh-body: 1.75;
	--lh-card: 1.8;
	--lh-body-loose: 1.85;
	--lh-lead: 1.9;
	--lh-lead-compact: 1.85;
	--lh-lead-loose: 1.95;
	--lh-long: 2;
	--tracking-none: 0;
	--tracking-tight: -.01em;
	--tracking-brand: .05em;
	--tracking-label: .15em;
	--tracking-label-wide: .2em;
	--weight-regular: 400;
	--weight-medium: 500;
	--weight-semibold: 600;
	--weight-bold: 700;
	--weight-black: 900;
}

html { scroll-behavior: smooth; }
body {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: var(--font-body);
	background: var(--white);
	color: var(--gray-700);
	line-height: var(--lh-body);
	overflow-x: hidden;
}
img, video { max-width: 100%; height: auto; }
a { color: inherit; }
.en { font-family: 'Outfit', sans-serif; letter-spacing: var(--tracking-brand); }
.sp-br { display: none; }

/* ---------- Header ---------- */
.ast-header {
	position: fixed; top: 0; left: 0; right: 0; z-index: 200;
	background: rgba(255,255,255,0.97);
	-webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
	border-bottom: 1px solid var(--gray-200);
	height: var(--header-height); display: flex; align-items: center;
}
.ast-header .header-inner {
	max-width: none; margin: 0; width: 100%;
	padding: 0 64px; display: flex; align-items: center; justify-content: space-between;
}
.ast-header .logo { display: flex; align-items: center; text-decoration: none; }
.ast-header .logo-img { height: 42px; width: auto; display: block; }

.ast-nav { display: flex; gap: 42px; align-items: center; }
.ast-nav ul { display: flex; gap: 45px; align-items: center; list-style: none; }
.ast-nav .menu-item,
.ast-nav .ast-nav-item { position: relative; }
.ast-nav a { position: relative; font-size: var(--font-nav); font-weight: var(--weight-bold); color: #1A2744; text-decoration: none; letter-spacing: var(--tracking-none); transition: color .2s; }
.ast-nav a:hover { color: #1A2744; }
.ast-nav .current-menu-item > a,
.ast-nav .current_page_parent > a,
.ast-nav .current-menu-ancestor > a,
.ast-nav a.active { color: #1A2744; font-weight: var(--weight-bold); }
.ast-nav .current-menu-item > a::after,
.ast-nav .current_page_parent > a::after,
.ast-nav .current-menu-ancestor > a::after,
.ast-nav a.active::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	bottom: -8px;
	height: 3px;
	background: #009DE4;
	border-radius: 999px;
}
.ast-nav .nav-cta > a, .ast-nav a.nav-cta {
	background: #E60012; color: #FFFFFF !important;
	padding: 9px 28px; border-radius: 6px; font-weight: var(--weight-bold) !important;
}
.ast-nav .nav-cta > a::after, .ast-nav a.nav-cta::after { content: none; }
.ast-nav .nav-cta > a:hover, .ast-nav a.nav-cta:hover { background: #c4000f; }
.ast-nav .ast-recruit-menu > a { padding-right: 14px; }
.ast-nav .ast-recruit-menu > a::before {
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	width: 6px;
	height: 6px;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: translateY(-70%) rotate(45deg);
	opacity: .55;
}
.ast-nav .sub-menu {
	position: absolute;
	left: 50%;
	top: calc(100% + 28px);
	z-index: 220;
	display: flex;
	flex-direction: column;
	gap: 0;
	align-items: stretch;
	min-width: 170px;
	padding: 8px;
	background: #fff;
	border: 1px solid var(--gray-200);
	border-radius: 8px;
	box-shadow: 0 18px 42px rgba(15, 23, 42, .14);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translate(-50%, 8px);
	transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s;
}
.ast-nav .sub-menu::before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: -28px;
	height: 28px;
}
.ast-nav .ast-recruit-menu:hover > .sub-menu,
.ast-nav .ast-recruit-menu:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translate(-50%, 0);
	transition: opacity .18s ease, transform .18s ease, visibility 0s;
}
.ast-nav .sub-menu a {
	display: block;
	padding: 10px 12px;
	border-radius: 4px;
	white-space: nowrap;
	font-size: var(--font-ui-sm);
	line-height: 1.4;
}
.ast-nav .sub-menu a::before,
.ast-nav .sub-menu a::after { content: none !important; }
.ast-nav .sub-menu a:hover { background: var(--gray-50); color: var(--red); }
.ast-nav .sub-menu .ast-submenu-top { display: none; }

.ast-nav-toggle { display: none; flex-direction: column; gap: 5px; width: 28px; height: 22px; background: none; border: 0; cursor: pointer; padding: 0; }
.ast-nav-toggle span { display: block; height: 2px; width: 100%; background: var(--navy); transition: .3s; }
.ast-nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.ast-nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.ast-nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Hero media（全ページ共通：映像/ポスター/プレースホルダ） ---------- */
.ast-hero-media { position: absolute; inset: 0; overflow: hidden; }
.ast-hero-video { width: 100%; height: 100%; object-fit: cover; display: block; }
.ast-hero-poster { width: 100%; height: 100%; background-size: cover; background-position: center; }
.ast-hero-placeholder {
	width: 100%; height: 100%;
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
	background: linear-gradient(135deg, #e2e8f0, #cbd5e1);
	color: #64748B; font-size: var(--font-ui); text-align: center; padding: 16px;
}
.ast-hero-placeholder small { font-size: var(--font-caption); opacity: .8; }
/* 背景型ヒーロー（テキスト主体ページ）に映像を敷く場合：内容を前面へ＋可読性オーバーレイ */
.ast-hero-media.hero-bg-media { z-index: 0; }
.ast-hero-media.hero-bg-media::after { content: ''; position: absolute; inset: 0; background: transparent; }
.hero > .hero-inner, .page-hero > .hero-inner { position: relative; z-index: 6; }

/* ---------- HERO text halftone ---------- */
.hero-halftone-target {
	position: relative;
	isolation: isolate;
	width: fit-content;
	max-width: 100%;
}

/* ---------- Unified HERO video readability ---------- */
body.page-top .fv::before,
body:not(.page-top) .hero::before,
body:not(.page-top) .page-hero::before {
	content: none !important;
	background: none !important;
	pointer-events: none !important;
}

body.page-top .fv::after,
body:not(.page-top) .hero::after,
body:not(.page-top) .page-hero::after {
	content: none !important;
	background: none !important;
}

body:not(.page-top) .hero .breadcrumb .cur,
body:not(.page-top) .hero .breadcrumb .current,
body:not(.page-top) .hero .hero-breadcrumb .cur,
body:not(.page-top) .page-hero .breadcrumb .cur,
body:not(.page-top) .page-hero .breadcrumb .current {
	color: rgba(255,255,255,.96) !important;
}

body:not(.page-top) .hero .hero-h1 .hl-mark,
body:not(.page-top) .hero .hero-h1 .accent,
body:not(.page-top) .hero .hero-h1 .yl,
body:not(.page-top) .hero .hero-h1 .line2,
body:not(.page-top) .hero .hero-h1 .sub-line {
	background: transparent !important;
}

body.page-template-page-services .hero .hero-h1 .accent,
body.page-template-page-achievements .hero .hero-h1 .yl,
body.page-template-page-recruit .hero .hero-h1 .hl-mark,
body.page-template-page-mid-career .hero .hero-h1 .hl-mark,
body.page-template-page-new-grad .hero .hero-h1 .hl-mark {
	color: var(--red) !important;
}

body:not(.page-template-page-blog):not(.blog):not(.single-post):not(.category):not(.tag):not(.date):not(.author):not(.search) .hero > .hero-inner,
body:not(.page-template-page-blog):not(.blog):not(.single-post):not(.category):not(.tag):not(.date):not(.author):not(.search) .page-hero > .hero-inner,
body.page-top .fv > .fv-inner {
	position: relative;
	z-index: 4;
}

body.page-top .fv .ctas { z-index: 4; }

/* ---------- Short desktop hero guard ---------- */
@media (min-width: 769px) and (max-height: 860px) {
	body.page-top .fv,
	body:not(.page-top) .hero,
	body:not(.page-top) .page-hero {
		min-height: 640px !important;
	}

	body.page-template-page-new-grad .hero,
	body.page-template-page-mid-career .hero {
		min-height: 720px !important;
	}

	.page-template-page-new-grad .hero-inner > *,
	.page-template-page-mid-career .hero-inner > *,
	body.page-recruit .hero-left {
		transform: none !important;
	}
}

/* ---------- Section reveal motion ---------- */
html.ast-motion-ready .ast-reveal-item {
	opacity: 0;
	transform: translate3d(0, 34px, 0);
	filter: blur(7px);
	transition:
		opacity .78s cubic-bezier(.16, 1, .3, 1),
		transform .78s cubic-bezier(.16, 1, .3, 1),
		filter .78s cubic-bezier(.16, 1, .3, 1);
	transition-delay: var(--ast-reveal-delay, 0ms);
	will-change: opacity, transform, filter;
}

html.ast-motion-ready .ast-reveal-media {
	transform: translate3d(0, 42px, 0) scale(1.025);
	transform-origin: center center;
}

html.ast-motion-ready .ast-reveal-item.is-inview {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
	filter: blur(0);
}

html.ast-motion-ready .ast-reveal-section {
	transition: background-color .8s cubic-bezier(.16, 1, .3, 1);
}

@media (prefers-reduced-motion: reduce) {
	html.ast-motion-ready .ast-reveal-item {
		opacity: 1 !important;
		transform: none !important;
		filter: none !important;
		transition: none !important;
	}
}

/* ---------- Footer（決定稿準拠：白背景・ライトテーマ） ---------- */
.ast-footer { background: var(--white); padding: 100px 0 0; border-top: 1px solid var(--gray-200); }
.ast-footer .wrap { max-width: 1200px; margin: 0 auto; padding: 0 40px; }
.ast-footer .footer-grid {
	display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1fr; gap: 48px;
	padding-bottom: 86px; border-bottom: 1px solid var(--gray-200);
}
.ast-footer .footer-logo { display: block; margin-bottom: 14px; }
.ast-footer .footer-logo-img { height: 62px; width: auto; display: block; }
.ast-footer .footer-logo-img-footer { width: 168px; height: auto; }
.ast-footer .footer-logo small { display: block; font-family: 'Outfit', sans-serif; font-size: var(--font-body); font-weight: 800; color: var(--navy); letter-spacing: .04em; margin-top: 6px; }
.ast-footer .footer-brand p { font-size: var(--font-ui); color: var(--gray-500); line-height: 1.85; max-width: 280px; }
.ast-footer .footer-nav h4 { font-size: var(--font-ui-sm); font-weight: var(--weight-bold); letter-spacing: .04em; color: var(--navy); margin-bottom: 22px; }
.ast-footer .footer-nav ul { list-style: none; }
.ast-footer .footer-nav li { margin-bottom: 14px; }
.ast-footer .footer-nav a { font-size: var(--font-body-sm); color: var(--gray-500); text-decoration: none; transition: color .2s; }
.ast-footer .footer-nav a:hover { color: var(--red); }
.ast-footer .footer-btm { padding: 34px 0; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; border-top: 1px solid var(--gray-100); }
.ast-footer .footer-btm p { font-size: var(--font-footer-meta); color: var(--gray-400); }
.ast-footer .footer-btm-links { display: flex; gap: 24px; }
.ast-footer .footer-btm-links a { font-size: var(--font-footer-meta); color: var(--gray-400); text-decoration: none; }

/* ---------- Responsive（チャンク：ヘッダー/フッター） ---------- */
@media (max-width: 768px) {
	.ast-header .header-inner { padding: 0 20px; }
	.ast-nav-toggle { display: flex; }
	.ast-nav {
		position: fixed; top: var(--header-height); left: 0; right: 0;
		flex-direction: column; gap: 0; align-items: stretch;
		background: rgba(255,255,255,.98); border-bottom: 1px solid var(--gray-200);
		padding: 8px 20px 16px;
		z-index: 190;
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: none;
		clip-path: inset(0 0 100% 0);
		transition:
			clip-path .28s cubic-bezier(.16, 1, .3, 1),
			opacity .2s ease,
			visibility 0s linear .28s;
	}
	.ast-nav.is-open {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		clip-path: inset(0 0 0 0);
		transition:
			clip-path .28s cubic-bezier(.16, 1, .3, 1),
			opacity .2s ease,
			visibility 0s;
	}
	.ast-nav ul { flex-direction: column; gap: 0; align-items: stretch; width: 100%; }
	.ast-nav a { display: block; padding: 14px 0; border-bottom: 1px solid var(--gray-100); }
	.ast-nav .menu-item,
	.ast-nav .ast-nav-item { width: 100%; }
	.ast-nav .current-menu-item > a::after,
	.ast-nav .current_page_parent > a::after,
	.ast-nav .current-menu-ancestor > a::after,
	.ast-nav a.active::after {
		left: 0;
		right: auto;
		bottom: -1px;
		width: 42px;
		height: 3px;
	}
	.ast-nav .ast-recruit-menu > a { padding-right: 0; }
	.ast-nav .ast-recruit-menu > a::before { content: none; }
	.ast-nav .sub-menu {
		position: static;
		z-index: auto;
		min-width: 0;
		padding: 0 0 4px 16px;
		margin: -2px 0 4px;
		background: transparent;
		border: 0;
		border-radius: 0;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: none;
		transition: none;
	}
	.ast-nav .sub-menu::before { content: none; }
	.ast-nav .sub-menu .ast-submenu-top { display: block; }
	.ast-nav .sub-menu a {
		padding: 10px 0;
		font-size: var(--font-ui-sm);
		color: var(--gray-500);
		border-bottom: 1px solid var(--gray-100);
		border-radius: 0;
	}
	.ast-nav .sub-menu a:hover { background: transparent; color: var(--red); }
	.ast-nav .nav-cta > a, .ast-nav a.nav-cta { display: inline-block; margin-top: 12px; }
	.ast-footer .footer-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
	.ast-footer .footer-brand { grid-column: 1 / -1; }
	.ast-footer .footer-brand p { max-width: none; }
	.ast-footer .footer-logo-img-footer { width: 146px; }
	.ast-footer .wrap { padding: 0 20px; }
	.ast-footer .footer-btm { flex-direction: column; align-items: flex-start; }
	.sp-br { display: block; }
}
/* Shared form confirmation flow */
.ast-entry-form .form-steps {
  display:flex;
  align-items:center;
  gap:0;
  margin:0 0 36px;
  padding:0 0 36px;
  border-bottom:1px solid var(--border);
}
.ast-entry-form .step {
  display:flex;
  align-items:center;
  gap:10px;
  flex:1;
  position:relative;
}
.ast-entry-form .step:not(:last-child)::after {
  content:'';
  position:absolute;
  left:50%;
  right:0;
  top:50%;
  width:100%;
  height:1px;
  background:var(--blue);
  z-index:0;
}
.ast-entry-form .step-num {
  width:46px;
  height:46px;
  border:2px solid var(--blue);
  border-radius:50%;
  background:#fff;
  color:var(--blue);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:'Outfit',sans-serif;
  font-size:1rem;
  font-weight:800;
  flex-shrink:0;
  position:relative;
  z-index:1;
}
.ast-entry-form .step.on .step-num,
.ast-entry-form .step.done .step-num {
  background:var(--blue);
  color:#fff;
}
.ast-entry-form .step-label {
  color:var(--sub);
  font-size:.9rem;
  font-weight:700;
  position:relative;
  z-index:1;
}
.ast-entry-form .step.on .step-label { color:var(--navy); }
.ast-contact-form .form-panel.is-confirming > *:not(.form-intro):not(.form-steps):not(.ast-form-confirmation) {
  display:none !important;
}
.ast-entry-form.is-confirming > *,
.ast-entry-form.is-complete > * {
  display:none !important;
}
.ast-entry-form.is-confirming > .form-steps,
.ast-entry-form.is-confirming > .ast-form-confirmation,
.ast-entry-form.is-complete > .form-steps,
.ast-entry-form.is-complete > .form-success {
  display:flex !important;
}
.ast-entry-form.is-confirming > .ast-form-confirmation,
.ast-entry-form.is-complete > .form-success {
  display:block !important;
}
.ast-form-confirmation {
  color:var(--body);
}
.ast-form-confirmation-title {
  margin:0 0 12px;
  color:var(--navy);
  font-family:'Zen Kaku Gothic New','Noto Sans JP',sans-serif;
  font-size:clamp(1.5rem, 3vw, 2rem);
  font-weight:900;
  line-height:1.4;
}
.ast-form-confirmation-title:focus { outline:none; }
.ast-form-confirmation-lead {
  margin:0 0 28px;
  color:var(--sub);
  font-size:.95rem;
  line-height:1.8;
}
.ast-confirm-list {
  margin:0;
  border-top:1px solid var(--border);
}
.ast-confirm-row {
  display:grid;
  grid-template-columns:minmax(150px, 34%) minmax(0, 1fr);
  border-bottom:1px solid var(--border);
}
.ast-confirm-row dt,
.ast-confirm-row dd {
  margin:0;
  padding:18px 20px;
  font-size:.95rem;
  line-height:1.75;
}
.ast-confirm-row dt {
  background:var(--bg);
  color:var(--navy);
  font-weight:700;
}
.ast-confirm-row dd {
  color:var(--body);
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.ast-confirm-actions {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  margin-top:32px;
}
.ast-confirm-button {
  min-height:56px;
  padding:14px 20px;
  border-radius:6px;
  font-family:'Noto Sans JP',sans-serif;
  font-size:1rem;
  font-weight:700;
  cursor:pointer;
  transition:background .2s, color .2s, border-color .2s;
}
.ast-confirm-back {
  border:1px solid var(--navy);
  background:#fff;
  color:var(--navy);
}
.ast-confirm-back:hover { background:var(--bg); }
.ast-confirm-submit {
  border:1px solid var(--red);
  background:var(--red);
  color:#fff;
}
.ast-confirm-submit:hover { background:#c0000f; border-color:#c0000f; }
.ast-confirm-submit:disabled { opacity:.65; cursor:wait; }

@media (max-width: 768px) {
  .ast-entry-form .form-steps {
    margin-bottom:28px;
    padding-bottom:28px;
  }
  .ast-entry-form .step { gap:6px; }
  .ast-entry-form .step-num { width:38px; height:38px; font-size:.9rem; }
  .ast-entry-form .step-label { font-size:.75rem; }
  .ast-confirm-row { grid-template-columns:1fr; }
  .ast-confirm-row dt { padding:13px 16px 6px; }
  .ast-confirm-row dd { padding:6px 16px 14px; }
  .ast-confirm-actions { grid-template-columns:1fr; }
}
