/* =========================================================
   ひかり訪問看護 — 内ページ共通スタイル
   ========================================================= */

/* ─── CSS変数（hikari-nurse.css と共通） ─── */
:root {
  --green-900: #0f2e22;
  --green-800: #163a2b;
  --green-700: #1f4d3a;
  --green-600: #2a6b51;
  --green-500: #3d8268;
  --green-100: #e3ece1;
  --green-50:  #eef3ea;
  --brown-700: #5a4327;
  --brown-600: #7a5d3a;
  --brown-500: #8b6f47;
  --brown-400: #a78760;
  --brown-300: #c3a983;
  --cream:   #f6f1e4;
  --cream-2: #efe8d5;
  --paper:   #fbf8ef;
  --ink:     #23201c;
  --ink-2:   #3d3a34;
  --ink-3:   #6b665d;
  --line:    rgba(35,32,28,.10);
  --line-2:  rgba(35,32,28,.18);
  --serif: 'Shippori Mincho','Noto Serif JP', serif;
  --sans:  'Noto Sans JP', system-ui, sans-serif;
  --latin: 'Cormorant Garamond','Cormorant', serif;
  --maxw:   1280px;
  --gutter: clamp(20px, 4vw, 56px);
}

/* ─── Arkhe デフォルトページヘッダー・パンくず非表示 ─── */
body.hikari-inner-page .p-topArea,
body.hikari-inner-page .p-breadcrumb { display: none !important; }

/* ─── 内ページではArkheヘッダーを非表示 ─── */
body.hikari-inner-page .l-header { display: none !important; }

/* ─── Arkhe上書き：本文エリアの余白・背景 ─── */
.hikari-inner-page {
  background: var(--paper);
  font-family: var(--sans);
  color: var(--ink);
  font-feature-settings: "palt";
  -webkit-font-smoothing: antialiased;
}
.hikari-inner-page .container {
  max-width: var(--maxw);
  margin: 0 auto;
  padding-left: var(--gutter);
  padding-right: var(--gutter);
}
.hikari-inner-page a { text-decoration: none; color: inherit }
.hikari-inner-page *, .hikari-inner-page *::before, .hikari-inner-page *::after {
  box-sizing: border-box;
}

/* ─── セクション共通見出し ─── */
.hikari-inner-page .sec-head { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-bottom: 48px }
.hikari-inner-page .sec-en {
  font-family: var(--latin); font-style: italic; font-size: clamp(13px,1.1vw,16px);
  color: var(--brown-500); font-weight: 500; letter-spacing: .28em;
  text-transform: uppercase; display: inline-flex; align-items: center; gap: 12px;
}
.hikari-inner-page .sec-en::before { content: ""; width: 32px; height: 1px; background: var(--brown-500) }
.hikari-inner-page .sec-jp {
  font-family: var(--serif); font-size: clamp(26px, 3vw, 40px); letter-spacing: .06em;
  line-height: 1.4; color: var(--green-900); font-weight: 500;
}

/* ─── ページヒーロー ─── */
.page-hero {
  background: var(--green-900);
  color: #fff;
  padding: clamp(120px, 16vw, 180px) var(--gutter) clamp(56px, 8vw, 100px);
  position: relative;
  overflow: hidden;
}
.page-hero__bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  opacity: .18; mix-blend-mode: luminosity;
}
.page-hero__bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(15,46,34,.3) 0%, rgba(15,46,34,.7) 100%);
}
.page-hero__inner {
  position: relative; z-index: 1;
  max-width: var(--maxw); margin: 0 auto;
}
.page-hero__en {
  font-family: var(--latin); font-style: italic;
  font-size: 12px; letter-spacing: .32em; color: #f4d489;
  margin: 0 0 14px; text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 12px;
}
.page-hero__en::before { content: ""; width: 32px; height: 1px; background: #f4d489 }
.page-hero__title {
  font-family: var(--serif); font-size: clamp(30px, 5vw, 56px);
  font-weight: 500; letter-spacing: .04em; margin: 0 0 16px;
  line-height: 1.35;
}
.page-hero__lead {
  font-size: clamp(14px, 1.4vw, 16px); line-height: 2; max-width: 560px;
  color: rgba(255,255,255,.82); font-weight: 300; letter-spacing: .04em; margin: 0;
}

/* ─── CTAセクション ─── */
.cta-section {
  padding: clamp(72px, 10vw, 120px) var(--gutter);
  background: linear-gradient(180deg, rgba(15,46,34,.82), rgba(15,46,34,.92)), var(--green-900);
  position: relative; overflow: hidden; text-align: center; color: #fff;
}
.cta-section::before {
  content: ""; position: absolute; inset: 0;
  background-image: url("https://images.unsplash.com/photo-1502082553048-f009c37129b9?auto=format&fit=crop&w=2000&q=60");
  background-size: cover; background-position: center;
  opacity: .2; mix-blend-mode: luminosity;
}
.cta-section__inner { position: relative; z-index: 1; max-width: var(--maxw); margin: 0 auto }
.cta-section__en {
  font-family: var(--latin); font-style: italic; font-size: 12px; letter-spacing: .32em;
  color: #f4d489; margin: 0 0 14px; text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 12px;
}
.cta-section__en::before { content: ""; width: 32px; height: 1px; background: #f4d489 }
.cta-section__title {
  font-family: var(--serif); font-size: clamp(24px, 3vw, 38px);
  font-weight: 500; letter-spacing: .06em; line-height: 1.6;
  margin: 0 0 20px; color: rgba(255,255,255,.9);
}
.cta-section__lead {
  font-size: 15px; line-height: 2; color: rgba(255,255,255,.7);
  margin: 0 0 48px; letter-spacing: .04em;
}
.cta-section__btns { display: flex; align-items: center; justify-content: center; gap: 20px; flex-wrap: wrap }
.cta-btn-tel {
  display: inline-flex; flex-direction: column; align-items: center;
  font-family: var(--latin); font-size: 32px; letter-spacing: .04em;
  color: #f4d489; font-weight: 500; line-height: 1;
}
.cta-btn-tel small {
  font-family: var(--sans); font-size: 11px; letter-spacing: .14em;
  color: rgba(255,255,255,.55); margin-top: 8px; font-weight: 400;
}
.cta-btn-form {
  display: inline-flex; align-items: center; gap: 12px;
  padding: 16px 36px; border: 1px solid rgba(255,255,255,.5); border-radius: 8px;
  font-family: var(--serif); letter-spacing: .14em; font-size: 15px;
  color: #fff; font-weight: 500; white-space: nowrap;
  transition: background .25s, color .25s, border-color .25s, gap .25s;
}
.cta-btn-form:hover { background: rgba(244,212,137,.12); border-color: #f4d489; gap: 16px }

/* ─── テキストボタン（矢印付き） ─── */
.hikari-inner-page .btn-text {
  display: inline-flex; align-items: center; gap: 12px;
  font-family: var(--serif); letter-spacing: .1em; font-size: 14px;
  font-weight: 500; color: var(--green-700);
  padding-bottom: 5px; border-bottom: 1px solid var(--green-700);
  transition: gap .25s, color .25s, border-color .25s;
}
.hikari-inner-page .btn-text:hover { gap: 20px; color: var(--brown-500); border-color: var(--brown-500) }
.hikari-inner-page .btn-text .arrow { width: 22px; height: 1px; background: currentColor; position: relative }
.hikari-inner-page .btn-text .arrow::after {
  content: ""; position: absolute; right: 0; top: -3px;
  width: 7px; height: 7px; border-right: 1px solid currentColor;
  border-top: 1px solid currentColor; transform: rotate(45deg);
}

/* ─── 内ページ スティッキーヘッダー ─── */
.admin-bar .inner-header { top: 32px }
@media screen and (max-width: 782px) {
  .admin-bar .inner-header { top: 46px }
}
.inner-header {
  position: fixed; inset: 0 0 auto 0; z-index: 50;
  padding: 10px var(--gutter);
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(251,248,239,.94);
  backdrop-filter: saturate(140%) blur(10px);
  -webkit-backdrop-filter: saturate(140%) blur(10px);
  box-shadow: 0 1px 0 var(--line);
  color: var(--ink);
}
.inner-header .logo { display: flex; align-items: center; gap: 12px; font-family: var(--serif); color: var(--ink); text-decoration: none }
.inner-header .logo-img { height: 34px; width: auto; max-width: 120px; object-fit: contain; display: block }
.inner-header .logo-mark {
  width: 34px; height: 34px; border-radius: 50%; flex: 0 0 auto;
  background:
    radial-gradient(circle at 35% 35%, #fff7d6 0%, #f4d489 35%, #c19350 70%, transparent 71%),
    radial-gradient(circle at 50% 60%, rgba(255,200,90,.4), transparent 60%);
  box-shadow: 0 0 0 1px rgba(35,32,28,.15) inset, 0 0 22px rgba(193,147,80,.35);
}
.inner-header .logo-text { display: flex; flex-direction: column }
.inner-header .logo-jp { font-size: 16px; letter-spacing: .06em; line-height: 1; font-weight: 500 }
.inner-header .logo-en { font-family: var(--latin); font-style: italic; font-size: 10px; letter-spacing: .18em; opacity: .7; margin-top: 4px }

.inner-nav { display: flex; align-items: center; gap: 28px; font-family: var(--serif); font-size: 14px; letter-spacing: .1em; font-weight: 500 }
.inner-nav a { position: relative; padding: 6px 0; color: var(--ink); text-decoration: none }
.inner-nav a .en { display: block; font-family: var(--latin); font-style: italic; font-size: 10px; letter-spacing: .24em; opacity: .6; margin-top: 2px; text-align: center; text-transform: uppercase; font-weight: 400 }
.inner-nav a::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 0; height: 1px; background: currentColor; transition: width .25s ease, left .25s ease }
.inner-nav a:hover::after { width: 100%; left: 0 }

.inner-header .header-cta { display: flex; align-items: center; gap: 12px }
.inner-header .tel-pill { display: flex; flex-direction: column; align-items: flex-end; font-family: var(--latin); line-height: 1 }
.inner-header .tel-pill .num { font-size: 15px; letter-spacing: .04em; font-weight: 500; color: var(--ink) }
.inner-header .tel-pill .lab { font-size: 9px; letter-spacing: .22em; opacity: .7; margin-top: 4px; font-family: var(--sans) }
.inner-header .btn-contact {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 11px 20px 11px 22px; border-radius: 8px;
  background: var(--brown-500); color: #fff;
  font-family: var(--serif); letter-spacing: .14em; font-size: 13px; font-weight: 500;
  transition: background .2s ease, gap .2s ease; white-space: nowrap;
}
.inner-header .btn-contact:hover { background: var(--brown-600); gap: 12px }
.inner-header .btn-contact__arrow { flex-shrink: 0; opacity: .85 }

@media (max-width: 900px) {
  .inner-nav { display: none }
}
@media (max-width: 680px) {
  .inner-header .tel-pill { display: none }
  .inner-header .logo-en  { display: none }
}

/* ─── フォーカス（キーボードアクセシビリティ） ─── */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid var(--brown-500);
  outline-offset: 3px;
  border-radius: 2px;
}

/* ─── prefers-reduced-motion ─── */
@media (prefers-reduced-motion: reduce) {
  .fade-up { opacity: 1; transform: none; transition: none }
  .fade-up.is-visible { opacity: 1; transform: none }
  * { transition-duration: .01ms !important; animation-duration: .01ms !important }
}

/* ─── スクロールアニメーション ─── */
.fade-up {
  opacity: 0; transform: translateY(20px);
  transition: opacity .55s ease, transform .55s ease;
}
.fade-up.is-visible { opacity: 1; transform: none; }

/* ─── スキップリンク（キーボードアクセシビリティ） ─── */
.skip-link {
  position: absolute; top: -100%; left: 0; z-index: 9999;
  padding: 12px 24px; background: var(--green-700); color: #fff;
  font-family: var(--sans); font-size: 14px; font-weight: 500;
  text-decoration: none; letter-spacing: .04em;
}
.skip-link:focus { top: 0 }

/* ─── レスポンシブ ─── */
@media (max-width: 768px) {
  .page-hero { padding-top: clamp(90px, 18vw, 130px) }
  .cta-section__btns { flex-direction: column; gap: 12px }
  .cta-btn-tel { font-size: 26px }
}