/* ==========================================================================
   IRODORI dental — TCD越え狙い 1テーマ完成版
   生成: 2026-04-27 / Phase A 排除策適用
   引用: data/generated/dental/design-spec.md (引用ログ参照)
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. CSS Variables (35+ tokens)
   -------------------------------------------------------------------------- */

:root {
  /* --- Color: 🅰 白×ライトブルー (inspiration-board.md より) --- */
  --dental-base: #ffffff;
  --dental-surface: #f5fafd;
  --dental-surface-alt: #f0f7fb;
  --dental-text: #2d2d2d;
  --dental-text-sub: #6b7b8a;
  --dental-text-muted: #93a3b3;
  --dental-border: #e3eef5;
  --dental-border-strong: #c9dbe7;

  --dental-primary: #5b9bd5;
  --dental-primary-dark: #3a7fb8;        /* fix #1: 旧 #1a8fd8 (inspiration-board NG 名指し色) を 1段彩度ダウン */
  --dental-primary-light: #e8f4fa;
  --dental-primary-pale: #f0f7fb;
  --dental-primary-deep: #1d4f7a;

  --dental-warn: #e58a1a;
  --dental-warn-bg: #fef4e5;
  --dental-success: #38a169;
  --dental-danger: #c53030;

  /* --- Typography (3層構造) --- */
  --dental-font-heading: "Shippori Mincho B1", "Yu Mincho", serif;
  --dental-font-body: "Noto Sans JP", "Hiragino Kaku Gothic ProN", sans-serif;
  --dental-font-en: "Cormorant Garamond", "Times New Roman", serif;

  --dental-fs-eyebrow: 0.75rem;
  --dental-fs-body: 1rem;
  --dental-fs-lead: 1.0625rem;
  --dental-fs-h3: 1.25rem;
  --dental-fs-h2: clamp(1.5rem, 3.2vw, 2.25rem);
  --dental-fs-h1: clamp(2rem, 5vw, 3.25rem);

  --dental-lh-body: 1.85;
  --dental-lh-tight: 1.4;
  --dental-ls-heading: -0.02em;
  --dental-ls-body: 0.04em;
  --dental-ls-en: 0.18em;

  /* --- Layout --- */
  --dental-container: 1280px;
  --dental-container-narrow: 1000px;
  --dental-px: clamp(20px, 5vw, 60px);
  --dental-section-py: clamp(72px, 10vh, 128px);
  --dental-radius-sm: 6px;
  --dental-radius: 12px;
  --dental-radius-lg: 24px;

  /* --- Shadows / Elevation --- */
  --dental-shadow-soft: 0 4px 16px rgba(91, 155, 213, 0.08);
  --dental-shadow-card: 0 6px 24px rgba(29, 79, 122, 0.10);
  --dental-shadow-cta: 0 8px 28px rgba(26, 143, 216, 0.32);

  /* --- Motion --- */
  --dental-ease-soft: cubic-bezier(0.25, 0.1, 0.25, 1);
  --dental-ease-dramatic: cubic-bezier(0.83, 0, 0.17, 1);
  --dental-ease-snappy: cubic-bezier(0.4, 0, 0.2, 1);
  --dental-dur-fast: 200ms;
  --dental-dur: 360ms;
  --dental-dur-slow: 720ms;

  /* --- Loader --- */
  --irodori-loader-bg: #1d4f7a;
  --irodori-loader-text: #ffffff;
  --irodori-loader-duration: 2.6s;
  --irodori-loader-exit-duration: 0.8s;
  --irodori-ease-loader: cubic-bezier(0.83, 0, 0.17, 1);
  --irodori-z-loader: 9999;
}

@property --irodori-circle-r {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 0%;
}


/* --------------------------------------------------------------------------
   2. Reset + Base
   -------------------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body.dental-body {
  margin: 0;
  font-family: var(--dental-font-body);
  font-size: var(--dental-fs-body);
  line-height: var(--dental-lh-body);
  letter-spacing: var(--dental-ls-body);
  color: var(--dental-text);
  background: var(--dental-base);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img { max-width: 100%; height: auto; display: block; }
button { font: inherit; cursor: pointer; border: 0; background: none; color: inherit; padding: 0; }
a { color: inherit; text-decoration: none; }
:focus-visible { outline: 2px solid var(--dental-primary-dark); outline-offset: 3px; border-radius: 3px; }

h1, h2, h3, h4 {
  font-family: var(--dental-font-heading);
  font-weight: 700;
  line-height: var(--dental-lh-tight);
  letter-spacing: var(--dental-ls-heading);
  margin: 0;
}


/* --------------------------------------------------------------------------
   3. PRELOADER L11 サークル (歯シルエット円形マスク)
   -------------------------------------------------------------------------- */

.dental-loader {
  position: fixed;
  inset: 0;
  z-index: var(--irodori-z-loader);
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: all;
}

.dental-loader__circle-bg {
  position: absolute;
  inset: 0;
  background: var(--irodori-loader-bg);
  --irodori-circle-r: 150%;
  clip-path: circle(var(--irodori-circle-r) at 50% 50%);
  transition: --irodori-circle-r var(--irodori-loader-exit-duration) var(--irodori-ease-loader);
}

.dental-loader__circle-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  color: var(--irodori-loader-text);
}

.dental-loader__tooth {
  opacity: 0;
  transform: scale(0.6) rotate(-8deg);
  animation: dentalLoaderTooth 0.8s var(--dental-ease-soft) 0.3s forwards;
}
@keyframes dentalLoaderTooth {
  to { opacity: 1; transform: scale(1) rotate(0); }
}

.dental-loader__circle-text {
  font-family: var(--dental-font-heading);
  font-size: 1.4rem;
  letter-spacing: 0.18em;
  opacity: 0;
  transform: translateY(8px);
  animation: dentalLoaderText 0.6s var(--dental-ease-soft) 0.6s forwards;
}
.dental-loader__circle-sub {
  font-family: var(--dental-font-en);
  font-size: 0.75rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  opacity: 0;
  animation: dentalLoaderText 0.5s var(--dental-ease-soft) 0.9s forwards;
}
@keyframes dentalLoaderText {
  to { opacity: 0.9; transform: translateY(0); }
}

.dental-loader.is-exit .dental-loader__circle-bg { --irodori-circle-r: 0%; }
.dental-loader.is-exit .dental-loader__circle-content { animation: dentalLoaderOut 0.4s var(--dental-ease-soft) forwards; }
@keyframes dentalLoaderOut {
  to { opacity: 0; transform: scale(0.85); }
}

.dental-loader.is-hidden { display: none; }

@media (prefers-reduced-motion: reduce) {
  .dental-loader__tooth, .dental-loader__circle-text, .dental-loader__circle-sub { animation: none; opacity: 1; transform: none; }
  .dental-loader__circle-bg { transition: none; --irodori-circle-r: 0%; }
}


/* --------------------------------------------------------------------------
   4. HEADER (transparent → .is-scrolled)
   -------------------------------------------------------------------------- */

.dental-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 100;
  background: transparent;
  transition: background var(--dental-dur) var(--dental-ease-soft), box-shadow var(--dental-dur) var(--dental-ease-soft);
}
.dental-header.is-scrolled {
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(8px);
  box-shadow: var(--dental-shadow-soft);
}

.dental-header__inner {
  max-width: var(--dental-container);
  margin: 0 auto;
  padding: 14px var(--dental-px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
}
.dental-header__nav { flex: 0 1 auto; min-width: 0; }

.dental-header__logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--dental-base);
  transition: color var(--dental-dur) var(--dental-ease-soft);
  flex-shrink: 0;
}
.dental-header.is-scrolled .dental-header__logo { color: var(--dental-primary-deep); }
.dental-header__logo-mark { color: currentColor; line-height: 0; flex-shrink: 0; }
.dental-header__logo-text { white-space: nowrap; }
.dental-header__logo-jp { display: block; font-family: var(--dental-font-heading); font-size: 1.05rem; letter-spacing: 0.06em; white-space: nowrap; }
.dental-header__logo-en { display: block; font-family: var(--dental-font-en); font-size: 0.6875rem; letter-spacing: 0.4em; opacity: 0.75; white-space: nowrap; }

.dental-header__nav { color: var(--dental-base); transition: color var(--dental-dur); }
.dental-header.is-scrolled .dental-header__nav { color: var(--dental-text); }
.dental-header__nav-list { list-style: none; padding: 0; margin: 0; display: flex; gap: 18px; font-size: 0.82rem; letter-spacing: 0.02em; flex-wrap: nowrap; }
.dental-header__nav-list li { flex-shrink: 0; }
.dental-header__nav-list a { display: inline-block; padding: 8px 0; position: relative; white-space: nowrap; }
.dental-header__nav-list a[aria-current="page"] { color: var(--dental-primary-dark); font-weight: 700; }
.dental-header__nav-list a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 4px; height: 1px;
  background: currentColor; transform: scaleX(0); transform-origin: left center;
  transition: transform var(--dental-dur) var(--dental-ease-snappy);
}
.dental-header__nav-list a:hover::after { transform: scaleX(1); }
.dental-header__nav-list a:hover { opacity: 0.85; }

.dental-header__actions { display: flex; gap: 18px; align-items: center; color: var(--dental-base); padding-left: 32px; margin-left: 12px; border-left: 1px solid currentColor; border-color: rgba(255,255,255,0.25); }
.dental-header.is-scrolled .dental-header__actions { border-color: rgba(0,0,0,0.12); }
.dental-header.is-scrolled .dental-header__actions { color: var(--dental-text); }

.dental-header__tel {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--dental-font-heading); font-size: 1.05rem; font-weight: 700;
  padding: 6px 0;
}
.dental-header__tel:hover { color: var(--dental-primary-dark); }

.dental-header__cta {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 11px 20px;
  background: var(--dental-primary-dark);
  color: var(--dental-base);
  border-radius: 999px;
  font-size: 0.875rem; font-weight: 700; letter-spacing: 0.06em;
  white-space: nowrap;
  flex-shrink: 0;
  box-shadow: var(--dental-shadow-cta);
  transition: transform var(--dental-dur-fast) var(--dental-ease-snappy), background var(--dental-dur-fast) var(--dental-ease-snappy), box-shadow var(--dental-dur-fast);
}
.dental-header__tel { white-space: nowrap; flex-shrink: 0; }
.dental-header__actions { flex-shrink: 0; }
.dental-header__cta:hover { transform: translateY(-2px) scale(1.02); background: var(--dental-primary-deep); box-shadow: 0 12px 32px rgba(29, 79, 122, 0.4); }
.dental-header__cta:active { transform: translateY(0) scale(0.98); }

.dental-header__menu-btn { display: none; width: 40px; height: 40px; align-items: center; justify-content: center; flex-direction: column; gap: 5px; }
.dental-header__menu-btn span { display: block; width: 22px; height: 2px; background: currentColor; transition: transform 0.25s, opacity 0.25s; }


/* --------------------------------------------------------------------------
   5. HERO B (slider, 3スライド, フェード)
   -------------------------------------------------------------------------- */

.dental-hero {
  position: relative;
  min-height: 100vh;
  min-height: 100dvh;
  overflow: hidden;
  color: var(--dental-base);
  isolation: isolate;
}

.dental-hero__track { position: relative; height: 100vh; height: 100dvh; }

.dental-hero__slide {
  position: absolute; inset: 0;
  display: flex; align-items: center;
  opacity: 0; visibility: hidden;
  transition: opacity 1.2s var(--dental-ease-soft), visibility 0s linear 1.2s;
}
.dental-hero__slide.is-current { opacity: 1; visibility: visible; transition: opacity 1.2s var(--dental-ease-soft), visibility 0s; }

.dental-hero__media { position: absolute; inset: 0; z-index: -2; }
.dental-hero__media img {
  width: 100%; height: 100%; object-fit: cover; object-position: center;
  transform: scale(1.05);
  transition: transform 8s var(--dental-ease-soft);
}
.dental-hero__slide.is-current .dental-hero__media img { transform: scale(1.15); }

.dental-hero__overlay {
  position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(15, 35, 60, 0.45) 0%, rgba(20, 50, 80, 0.65) 100%);
}

.dental-hero__inner {
  position: relative;
  width: 100%;
  max-width: var(--dental-container);
  margin: 0 auto;
  padding: 0 var(--dental-px);
}

.dental-hero__eyebrow {
  font-family: var(--dental-font-en);
  font-size: 0.78rem; letter-spacing: 0.4em; text-transform: uppercase;
  opacity: 0.85; margin: 0 0 16px;
}

.dental-hero__title {
  font-size: var(--dental-fs-h1);
  font-weight: 700;
  margin: 0 0 24px;
  text-shadow: 0 2px 12px rgba(0,0,0,0.18);
}

.dental-hero__subtitle {
  font-family: var(--dental-font-body);
  font-size: var(--dental-fs-lead);
  line-height: 1.9;
  max-width: 520px;
  margin: 0 0 32px;
  opacity: 0.93;
}
.dental-hero__small { display: block; margin-top: 8px; font-size: 0.72rem; opacity: 0.7; }

.dental-hero__cta-group { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 48px; }
.dental-hero__cta {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 16px 28px;
  border-radius: 999px;
  font-size: 0.95rem; font-weight: 700; letter-spacing: 0.06em;
  transition: transform var(--dental-dur-fast) var(--dental-ease-snappy),
              box-shadow var(--dental-dur-fast),
              background-color var(--dental-dur-fast);
}
.dental-hero__cta--primary {
  background: var(--dental-primary-dark);
  color: var(--dental-base);
  box-shadow: var(--dental-shadow-cta);
}
.dental-hero__cta--primary:hover { transform: translateY(-3px); background: var(--dental-primary-deep); }
.dental-hero__cta--ghost {
  background: rgba(255,255,255,0.12);
  color: var(--dental-base);
  border: 1px solid rgba(255,255,255,0.5);
  backdrop-filter: blur(6px);
}
.dental-hero__cta--ghost:hover { background: rgba(255,255,255,0.22); border-color: var(--dental-base); }

.dental-hero__badges { list-style: none; padding: 0; margin: 0; display: flex; gap: 18px; flex-wrap: wrap; }
.dental-hero__badges li {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 10px 16px;
  background: rgba(255,255,255,0.12);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 8px;
  font-size: 0.82rem;
}
.dental-hero__badge-num {
  font-family: var(--dental-font-heading);
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--dental-warn);
  letter-spacing: 0.04em;
}

.dental-hero__indicators {
  position: absolute; bottom: 36px; left: 50%; transform: translateX(-50%);
  z-index: 5;
  display: flex; gap: 10px; align-items: center;
}
.dental-hero__indicator {
  width: 28px; height: 3px;
  background: rgba(255,255,255,0.35);
  border-radius: 2px;
  transition: background var(--dental-dur), width var(--dental-dur);
}
.dental-hero__indicator.is-active { background: var(--dental-base); width: 48px; }

.dental-hero__scroll {
  position: absolute; bottom: 16px; right: 48px;
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  color: var(--dental-base);
}
.dental-hero__scroll-text {
  font-family: var(--dental-font-en);
  font-size: 0.72rem;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  writing-mode: vertical-rl;
}
.dental-hero__scroll-line {
  width: 1px; height: 56px; background: var(--dental-base); position: relative; overflow: hidden;
}
.dental-hero__scroll-line::after {
  content: ""; position: absolute; left: 0; top: -100%; width: 100%; height: 100%;
  background: var(--dental-warn);
  animation: dentalScrollLine 2.4s var(--dental-ease-soft) infinite;
}
@keyframes dentalScrollLine {
  0% { top: -100%; }
  50% { top: 0; }
  100% { top: 100%; }
}


/* --------------------------------------------------------------------------
   6. NEWS — お知らせ
   -------------------------------------------------------------------------- */

.dental-news { background: var(--dental-surface); padding: var(--dental-section-py) var(--dental-px); }
.dental-news__inner { max-width: var(--dental-container-narrow); margin: 0 auto; }

.dental-news__head { display: flex; align-items: baseline; gap: 24px; margin-bottom: 36px; }
.dental-news__eyebrow { font-family: var(--dental-font-en); font-size: 0.85rem; letter-spacing: 0.35em; color: var(--dental-primary-dark); margin: 0; }
.dental-news__title { font-size: var(--dental-fs-h2); margin: 0; }

.dental-news__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; border-top: 1px solid var(--dental-border); }
.dental-news__item {
  display: grid;
  grid-template-columns: 130px 80px 1fr;
  align-items: center;
  gap: 20px;
  padding: 22px 8px;
  border-bottom: 1px solid var(--dental-border);
  transition: background var(--dental-dur-fast);
}
.dental-news__item:hover { background: rgba(91,155,213,0.06); }

.dental-news__date { font-family: var(--dental-font-en); font-size: 0.95rem; letter-spacing: 0.08em; color: var(--dental-text-sub); }

.dental-news__tag {
  display: inline-flex; justify-content: center;
  padding: 4px 10px;
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em;
  border-radius: 4px;
  background: var(--dental-primary-light); color: var(--dental-primary-deep);
}
.dental-news__tag--alert { background: var(--dental-warn-bg); color: var(--dental-warn); }

.dental-news__text { margin: 0; line-height: 1.7; font-size: 0.95rem; }


/* --------------------------------------------------------------------------
   7. FEATURES — 当院の特徴 (4アイコン)
   -------------------------------------------------------------------------- */

.dental-features { padding: var(--dental-section-py) var(--dental-px); background: var(--dental-base); }
.dental-features__inner { max-width: var(--dental-container); margin: 0 auto; }

.dental-features__head { text-align: center; margin-bottom: 56px; }
.dental-features__eyebrow { font-family: var(--dental-font-en); font-size: 0.85rem; letter-spacing: 0.35em; color: var(--dental-primary-dark); margin: 0 0 12px; }
.dental-features__title { font-size: var(--dental-fs-h2); margin: 0 0 18px; }
.dental-features__lead { color: var(--dental-text-sub); max-width: 560px; margin: 0 auto; }

.dental-features__grid {
  list-style: none; padding: 0; margin: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 28px;
}

.dental-features__card {
  position: relative;
  padding: 36px 28px 32px;
  background: var(--dental-surface);
  border: 1px solid var(--dental-border);
  border-radius: var(--dental-radius);
  transition: border-color var(--dental-dur), background var(--dental-dur), transform var(--dental-dur);
}
.dental-features__card:nth-child(odd) { border-radius: var(--dental-radius) var(--dental-radius-lg) var(--dental-radius) var(--dental-radius); }
.dental-features__card:nth-child(even) { border-radius: var(--dental-radius-lg) var(--dental-radius) var(--dental-radius) var(--dental-radius); }
.dental-features__card:hover {
  border-color: var(--dental-primary);
  background: var(--dental-base);
  transform: translateY(-6px);
  box-shadow: var(--dental-shadow-card);
}

/* fix #6: 1 枚を「主役」化して 4 枚均質を緩和 */
.dental-features__card--featured {
  background: var(--dental-primary-deep);
  color: var(--dental-base);
  border: 0;
  padding: 44px 32px 36px;
  position: relative;
  overflow: hidden;
}
.dental-features__card--featured::after {
  content: "";
  position: absolute; right: -40px; bottom: -40px;
  width: 180px; height: 180px;
  background: radial-gradient(circle, rgba(91, 155, 213, 0.45) 0%, transparent 70%);
  pointer-events: none;
}
.dental-features__card--featured .dental-features__icon {
  width: 72px; height: 72px;
  background: rgba(255,255,255,0.12);
  color: var(--dental-base);
  margin-bottom: 26px;
}
.dental-features__card--featured .dental-features__card-title { color: var(--dental-base); font-size: 1.25rem; }
.dental-features__card--featured .dental-features__card-text { color: rgba(255,255,255,0.85); font-size: 0.95rem; }
.dental-features__card--featured .dental-features__card-extra {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 22px;
  padding: 8px 16px;
  background: var(--dental-warn);
  color: var(--dental-base);
  border-radius: 999px;
  font-size: 0.78rem; font-weight: 700; letter-spacing: 0.06em;
}
.dental-features__card--featured:hover {
  background: var(--dental-primary-deep);
  color: var(--dental-base);
  transform: translateY(-6px) scale(1.01);
}

.dental-features__icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 64px; height: 64px;
  border-radius: 50%;
  background: var(--dental-primary-light);
  color: var(--dental-primary-dark);
  margin-bottom: 22px;
}

.dental-features__card-title { font-size: 1.125rem; margin: 0 0 12px; line-height: 1.5; }
.dental-features__card-text { font-size: 0.92rem; color: var(--dental-text-sub); margin: 0; line-height: 1.8; }


/* --------------------------------------------------------------------------
   8. MESSAGE — 院長挨拶 (左右分割)
   -------------------------------------------------------------------------- */

.dental-message {
  padding: var(--dental-section-py) var(--dental-px);
  /* fix #5: 135deg AI指紋グラデを撤去。縦方向 + 装飾 ::before で表情を出す */
  background: linear-gradient(to bottom, var(--dental-primary-pale) 0%, var(--dental-base) 72%);
  position: relative;
  overflow: hidden;
}
.dental-message::before {
  content: "";
  position: absolute;
  inset: 0 auto auto 0;
  width: 280px;
  height: 280px;
  background: radial-gradient(circle at 0 0, rgba(91, 155, 213, 0.08), transparent 70%);
  pointer-events: none;
}
.dental-message__inner { position: relative; z-index: 1; }
.dental-message__inner {
  max-width: var(--dental-container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 5fr 6fr;
  gap: 64px;
  align-items: center;
}

.dental-message__media { position: relative; }
.dental-message__media img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  border-radius: var(--dental-radius-lg);
  box-shadow: var(--dental-shadow-card);
}

.dental-message__name-card {
  position: absolute;
  bottom: -28px; right: -28px;
  background: var(--dental-base);
  padding: 20px 26px;
  border-radius: var(--dental-radius);
  box-shadow: var(--dental-shadow-card);
  border-top: 3px solid var(--dental-primary-dark);
}
.dental-message__role { font-family: var(--dental-font-en); font-size: 0.7rem; letter-spacing: 0.4em; color: var(--dental-primary-dark); margin: 0 0 4px; }
.dental-message__name { font-family: var(--dental-font-heading); font-size: 1.4rem; margin: 0 0 6px; }
.dental-message__qual { font-size: 0.76rem; color: var(--dental-text-sub); margin: 0; line-height: 1.6; }

.dental-message__body { padding: 16px 0; }
.dental-message__eyebrow { font-family: var(--dental-font-en); font-size: 0.85rem; letter-spacing: 0.35em; color: var(--dental-primary-dark); margin: 0 0 14px; }
.dental-message__title { font-size: var(--dental-fs-h2); margin: 0 0 24px; line-height: 1.6; }
.dental-message__lead { font-size: var(--dental-fs-lead); margin: 0 0 18px; line-height: 1.85; }
.dental-message__text { font-size: 0.95rem; color: var(--dental-text-sub); margin: 0 0 32px; }
.dental-message__small { display: block; margin-top: 12px; font-size: 0.72rem; color: var(--dental-text-muted); }

.dental-message__cta {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 28px;
  background: transparent;
  color: var(--dental-primary-deep);
  border: 1.5px solid var(--dental-primary-dark);
  border-radius: 999px;
  font-weight: 700; font-size: 0.9rem; letter-spacing: 0.08em;
  transition: background var(--dental-dur-fast), color var(--dental-dur-fast);
}
.dental-message__cta:hover { background: var(--dental-primary-dark); color: var(--dental-base); }


/* --------------------------------------------------------------------------
   9. SERVICES — 診療メニュー (タブ切替)
   -------------------------------------------------------------------------- */

.dental-services { padding: var(--dental-section-py) var(--dental-px); background: var(--dental-base); }
.dental-services__inner { max-width: var(--dental-container); margin: 0 auto; }

.dental-services__head { text-align: center; margin-bottom: 48px; }
.dental-services__eyebrow { font-family: var(--dental-font-en); font-size: 0.85rem; letter-spacing: 0.35em; color: var(--dental-primary-dark); margin: 0 0 12px; }
.dental-services__title { font-size: var(--dental-fs-h2); margin: 0; }

.dental-services__tabs {
  display: flex; flex-wrap: wrap; gap: 10px;
  justify-content: center;
  margin-bottom: 44px;
}
.dental-services__tab {
  padding: 12px 22px;
  background: var(--dental-surface);
  color: var(--dental-text-sub);
  border: 1px solid var(--dental-border);
  border-radius: 999px;
  font-size: 0.92rem; font-weight: 600;
  transition: background var(--dental-dur-fast), color var(--dental-dur-fast), border-color var(--dental-dur-fast);
}
.dental-services__tab:hover { color: var(--dental-primary-dark); border-color: var(--dental-primary); }
.dental-services__tab.is-active {
  background: var(--dental-primary-dark);
  color: var(--dental-base);
  border-color: var(--dental-primary-dark);
  box-shadow: 0 6px 18px rgba(26, 143, 216, 0.3);
}

.dental-services__panel {
  background: var(--dental-surface);
  border-radius: var(--dental-radius-lg);
  padding: 44px 48px;
  border: 1px solid var(--dental-border);
}
.dental-services__panel[hidden] { display: none; }

.dental-services__panel-title { font-size: 1.5rem; margin: 0 0 18px; line-height: 1.5; color: var(--dental-primary-deep); }
.dental-services__panel-text { margin: 0 0 28px; line-height: 1.85; }
.dental-services__panel-text small { display: block; margin-top: 10px; font-size: 0.74rem; color: var(--dental-text-muted); }

.dental-services__detail {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
  margin: 0;
  padding-top: 22px;
  border-top: 1px solid var(--dental-border);
}
.dental-services__detail div { display: grid; grid-template-rows: auto auto; gap: 4px; }
.dental-services__detail dt {
  font-size: 0.7rem; font-weight: 700; letter-spacing: 0.1em;
  color: var(--dental-primary-dark);
  text-transform: uppercase;
}
.dental-services__detail dd { margin: 0; font-size: 0.92rem; color: var(--dental-text); }


/* --------------------------------------------------------------------------
   10. STAFF — スタッフ紹介 (カルーセル)
   -------------------------------------------------------------------------- */

.dental-staff { padding: var(--dental-section-py) var(--dental-px); background: var(--dental-surface); }
.dental-staff__inner { max-width: var(--dental-container); margin: 0 auto; position: relative; }

.dental-staff__head { text-align: center; margin-bottom: 48px; }
.dental-staff__eyebrow { font-family: var(--dental-font-en); font-size: 0.85rem; letter-spacing: 0.35em; color: var(--dental-primary-dark); margin: 0 0 12px; }
.dental-staff__title { font-size: var(--dental-fs-h2); margin: 0 0 12px; }
.dental-staff__lead { color: var(--dental-text-sub); margin: 0; }

.dental-staff__track {
  display: flex; gap: 20px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-padding-left: var(--dental-px);
  -webkit-overflow-scrolling: touch;
  padding-bottom: 28px;
  scrollbar-width: thin;
  scrollbar-color: var(--dental-primary-light) transparent;
}
.dental-staff__track::-webkit-scrollbar { height: 6px; }
.dental-staff__track::-webkit-scrollbar-thumb { background: var(--dental-primary-light); border-radius: 3px; }

.dental-staff__card {
  flex: 0 0 260px;
  scroll-snap-align: start;
  background: var(--dental-base);
  border-radius: var(--dental-radius);
  overflow: hidden;
  transition: box-shadow var(--dental-dur), transform var(--dental-dur);
}
.dental-staff__card:hover { box-shadow: var(--dental-shadow-card); transform: scale(1.02); }

.dental-staff__photo { aspect-ratio: 1; background: var(--dental-primary-light); overflow: hidden; }
.dental-staff__photo img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dental-dur-slow) var(--dental-ease-soft); }
.dental-staff__card:hover .dental-staff__photo img { transform: scale(1.08); }

.dental-staff__name { font-size: 1.1rem; margin: 18px 22px 4px; }
.dental-staff__role { font-size: 0.82rem; color: var(--dental-primary-dark); margin: 0 22px 6px; font-weight: 600; letter-spacing: 0.04em; }
.dental-staff__qual { font-size: 0.78rem; color: var(--dental-text-sub); margin: 0 22px 24px; }

.dental-staff__nav { position: absolute; top: 64px; right: 0; display: flex; gap: 8px; }
.dental-staff__nav-btn {
  width: 44px; height: 44px;
  border-radius: 50%;
  background: var(--dental-base);
  color: var(--dental-primary-dark);
  border: 1px solid var(--dental-border);
  display: inline-flex; align-items: center; justify-content: center;
  transition: background var(--dental-dur-fast), color var(--dental-dur-fast), border-color var(--dental-dur-fast);
}
.dental-staff__nav-btn:hover { background: var(--dental-primary-dark); color: var(--dental-base); border-color: var(--dental-primary-dark); }


/* --------------------------------------------------------------------------
   11. GALLERY — 院内設備 (横スクロール)
   -------------------------------------------------------------------------- */

.dental-gallery { padding: var(--dental-section-py) 0; background: var(--dental-base); overflow: hidden; }
.dental-gallery__inner { max-width: var(--dental-container); margin: 0 auto; padding: 0 var(--dental-px); }
.dental-gallery__head { margin-bottom: 36px; }
.dental-gallery__eyebrow { font-family: var(--dental-font-en); font-size: 0.85rem; letter-spacing: 0.35em; color: var(--dental-primary-dark); margin: 0 0 10px; }
.dental-gallery__title { font-size: var(--dental-fs-h2); margin: 0; }

.dental-gallery__strip {
  display: flex; gap: 18px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  padding: 0 var(--dental-px) 24px;
  margin: 0 calc(var(--dental-px) * -1);
  scrollbar-width: thin;
}

.dental-gallery__item {
  flex: 0 0 320px;
  scroll-snap-align: start;
  margin: 0;
  position: relative;
}
.dental-gallery__item img {
  width: 100%; aspect-ratio: 4/3; object-fit: cover;
  border-radius: var(--dental-radius);
  filter: grayscale(0.05);
  transition: filter var(--dental-dur), transform var(--dental-dur);
}
.dental-gallery__item:hover img { filter: grayscale(0); transform: scale(1.02); }
.dental-gallery__item figcaption {
  margin-top: 12px;
  font-size: 0.85rem;
  color: var(--dental-text-sub);
  letter-spacing: 0.04em;
}


/* --------------------------------------------------------------------------
   12. SCHEDULE — 診療時間表 (○△休) ★業種固有
   -------------------------------------------------------------------------- */

.dental-schedule { padding: var(--dental-section-py) var(--dental-px); background: var(--dental-primary-pale); }
.dental-schedule__inner { max-width: var(--dental-container-narrow); margin: 0 auto; }

.dental-schedule__head { text-align: center; margin-bottom: 36px; }
.dental-schedule__eyebrow { font-family: var(--dental-font-en); font-size: 0.85rem; letter-spacing: 0.35em; color: var(--dental-primary-dark); margin: 0 0 10px; }
.dental-schedule__title { font-size: var(--dental-fs-h2); margin: 0; }

.dental-schedule__table {
  width: 100%;
  border-collapse: collapse;
  background: var(--dental-base);
  border-radius: var(--dental-radius);
  overflow: hidden;
  box-shadow: var(--dental-shadow-soft);
  font-family: var(--dental-font-body);
}
.dental-schedule__table th, .dental-schedule__table td {
  padding: 18px 8px;
  text-align: center;
  font-size: 0.95rem;
  border-bottom: 1px solid var(--dental-border);
  border-right: 1px solid var(--dental-border);
}
.dental-schedule__table th:last-child, .dental-schedule__table td:last-child { border-right: 0; }
.dental-schedule__table tbody tr:last-child td, .dental-schedule__table tbody tr:last-child th { border-bottom: 0; }

.dental-schedule__table thead th {
  background: var(--dental-primary-dark);
  color: var(--dental-base);
  font-weight: 700;
  letter-spacing: 0.08em;
}
.dental-schedule__table tbody th {
  background: var(--dental-surface);
  font-family: var(--dental-font-en);
  font-size: 0.85rem;
  letter-spacing: 0.06em;
  color: var(--dental-text-sub);
  text-align: right;
  padding-right: 18px;
}
.dental-schedule__table td {
  font-family: var(--dental-font-heading);
  font-size: 1.2rem;
  color: var(--dental-success);
  font-weight: 700;
}
.dental-schedule__table .dental-schedule__half { color: var(--dental-warn); }
.dental-schedule__table .dental-schedule__off { color: var(--dental-text-muted); }
.dental-schedule__table .dental-schedule__sun { color: var(--dental-danger); }

.dental-schedule__legend {
  list-style: none; padding: 0; margin: 18px 0 0;
  display: flex; gap: 20px; flex-wrap: wrap; justify-content: center;
  font-size: 0.85rem; color: var(--dental-text-sub);
}
.dental-schedule__legend span { font-family: var(--dental-font-heading); margin-right: 4px; font-weight: 700; color: var(--dental-text); }
.dental-schedule__note { font-size: 0.82rem; color: var(--dental-text-sub); margin-top: 14px; text-align: center; line-height: 1.7; }
.dental-schedule__note a { color: var(--dental-primary-dark); border-bottom: 1px solid currentColor; }


/* --------------------------------------------------------------------------
   13. ACCESS — アクセス複合ブロック
   -------------------------------------------------------------------------- */

.dental-access { padding: var(--dental-section-py) var(--dental-px); background: var(--dental-base); }
.dental-access__inner { max-width: var(--dental-container); margin: 0 auto; }

.dental-access__head { text-align: center; margin-bottom: 48px; }
.dental-access__eyebrow { font-family: var(--dental-font-en); font-size: 0.85rem; letter-spacing: 0.35em; color: var(--dental-primary-dark); margin: 0 0 10px; }
.dental-access__title { font-size: var(--dental-fs-h2); margin: 0; }

.dental-access__layout {
  display: grid;
  grid-template-columns: 5fr 4fr;
  gap: 56px;
  align-items: start;
}
.dental-access__map {
  border-radius: var(--dental-radius);
  overflow: hidden;
  box-shadow: var(--dental-shadow-soft);
}
.dental-access__map-frame {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  aspect-ratio: 4/3;
  background: var(--dental-primary-light);
  color: var(--dental-primary-dark);
  gap: 12px;
}
.dental-access__map-frame p { font-size: 0.85rem; color: var(--dental-primary-deep); margin: 0; }

.dental-access__address {
  font-style: normal;
  font-size: 0.95rem;
  margin: 0 0 24px;
  line-height: 1.85;
}
.dental-access__address strong { font-family: var(--dental-font-heading); font-size: 1.15rem; display: block; margin-bottom: 6px; }

.dental-access__routes { margin: 0 0 28px; padding: 0; }
.dental-access__route { display: grid; grid-template-columns: 130px 1fr; gap: 16px; padding: 16px 0; border-bottom: 1px dashed var(--dental-border); }
.dental-access__route:last-child { border-bottom: 0; }
.dental-access__route dt {
  font-family: var(--dental-font-heading);
  font-size: 0.92rem;
  color: var(--dental-primary-deep);
  letter-spacing: 0.04em;
}
.dental-access__route dd { margin: 0; font-size: 0.9rem; color: var(--dental-text-sub); line-height: 1.85; }
.dental-access__info {}

.dental-access__cta {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 24px;
  background: var(--dental-primary-dark); color: var(--dental-base);
  border-radius: 999px;
  font-weight: 700; font-size: 0.9rem; letter-spacing: 0.06em;
  transition: background var(--dental-dur-fast), transform var(--dental-dur-fast);
}
.dental-access__cta:hover { background: var(--dental-primary-deep); transform: translateY(-2px); }


/* --------------------------------------------------------------------------
   14. FOOTER
   -------------------------------------------------------------------------- */

.dental-footer { background: var(--dental-primary-deep); color: rgba(255,255,255,0.85); padding: 80px var(--dental-px) 32px; }
.dental-footer__inner {
  max-width: var(--dental-container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 48px;
}

.dental-footer__brand { padding-right: 24px; }
.dental-footer__logo { display: inline-block; font-family: var(--dental-font-heading); font-size: 1.3rem; color: var(--dental-base); margin-bottom: 14px; letter-spacing: 0.04em; }
.dental-footer__tagline { font-size: 0.85rem; line-height: 1.85; opacity: 0.8; margin: 0 0 14px; }
.dental-footer__tel { font-family: var(--dental-font-heading); font-size: 1.25rem; color: var(--dental-base); margin: 0; letter-spacing: 0.04em; }
.dental-footer__tel a { border-bottom: 1px dashed rgba(255,255,255,0.3); }

.dental-footer__nav h3, .dental-footer__sns h3 {
  font-family: var(--dental-font-en);
  font-size: 0.78rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--dental-base);
  margin: 0 0 18px;
  font-weight: 700;
}
.dental-footer__nav ul, .dental-footer__sns ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; font-size: 0.88rem; }
.dental-footer__nav a { transition: color var(--dental-dur-fast), padding-left var(--dental-dur-fast); }
.dental-footer__nav a:hover { color: var(--dental-base); padding-left: 4px; }

.dental-footer__sns ul { flex-direction: row; gap: 14px; margin-bottom: 18px; }
.dental-footer__sns a {
  display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px;
  border: 1px solid rgba(255,255,255,0.25);
  border-radius: 50%;
  transition: background var(--dental-dur-fast), border-color var(--dental-dur-fast);
}
.dental-footer__sns a:hover { background: var(--dental-base); color: var(--dental-primary-deep); border-color: var(--dental-base); }
.dental-footer__legal { font-size: 0.74rem; opacity: 0.6; margin: 0; line-height: 1.7; }

.dental-footer__copyright {
  margin-top: 56px;
  text-align: center;
  font-family: var(--dental-font-en);
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  color: rgba(255,255,255,0.45);
}


/* --------------------------------------------------------------------------
   15. MOBILE BOTTOM CTA (電話 / WEB予約 / LINE)
   -------------------------------------------------------------------------- */

.dental-mobile-cta {
  position: fixed; bottom: 0; left: 0; right: 0;
  z-index: 90;
  display: none;
  grid-template-columns: 1fr 1fr 1fr;
  background: var(--dental-base);
  border-top: 1px solid var(--dental-border);
  box-shadow: 0 -4px 16px rgba(29,79,122,0.08);
  padding: 8px 0 max(8px, env(safe-area-inset-bottom));
}
.dental-mobile-cta__btn {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 8px 4px;
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.04em;
  color: var(--dental-text);
  transition: background var(--dental-dur-fast), color var(--dental-dur-fast);
}
.dental-mobile-cta__btn--tel { color: var(--dental-warn); }
.dental-mobile-cta__btn--web { color: var(--dental-primary-dark); }
.dental-mobile-cta__btn--line { color: var(--dental-success); }
.dental-mobile-cta__btn:active { background: var(--dental-surface); }


/* --------------------------------------------------------------------------
   16. SCROLL ANIMATIONS — S1 fadeInUp + S2 slideLeft + S10 blur-reveal
   -------------------------------------------------------------------------- */

.dental-anim { opacity: 0; transition: opacity 0.8s var(--dental-ease-soft), transform 0.8s var(--dental-ease-soft), filter 0.8s var(--dental-ease-soft); }
.dental-anim--fade { transform: translateY(28px); }
.dental-anim--left { transform: translateX(-42px); }
.dental-anim--right { transform: translateX(42px); }
.dental-anim--blur { filter: blur(18px); transform: scale(0.96); }

.dental-anim.is-inview { opacity: 1; transform: none; filter: blur(0); }

@media (prefers-reduced-motion: reduce) {
  .dental-anim { opacity: 1; transform: none; filter: none; transition: none; }
}


/* --------------------------------------------------------------------------
   17. RESPONSIVE — Container Queries 補完
   -------------------------------------------------------------------------- */

@media (max-width: 991px) {
  .dental-header__nav { display: none; }
  .dental-header__menu-btn { display: inline-flex; }
  .dental-message__inner { grid-template-columns: 1fr; gap: 40px; }
  .dental-message__name-card { right: 16px; bottom: -20px; }
  .dental-access__layout { grid-template-columns: 1fr; gap: 32px; }
  .dental-footer__inner { grid-template-columns: 1fr 1fr; gap: 36px; }
}

@media (max-width: 768px) {
  :root { --dental-section-py: 72px; }
  .dental-header__tel span { display: none; }
  .dental-hero__title { font-size: clamp(1.75rem, 7vw, 2.5rem); }
  .dental-hero__badges { gap: 10px; }
  .dental-hero__scroll { display: none; }
  .dental-news__item { grid-template-columns: 90px auto 1fr; gap: 12px; padding: 16px 4px; }
  .dental-news__date { font-size: 0.82rem; }
  .dental-features__grid { gap: 18px; }
  .dental-services__panel { padding: 28px 22px; }
  .dental-services__panel-title { font-size: 1.2rem; }
  .dental-staff__nav { display: none; }
  .dental-schedule__table th, .dental-schedule__table td { padding: 12px 4px; font-size: 0.85rem; }
  .dental-mobile-cta { display: grid; }
  body.dental-body { padding-bottom: 76px; }
  .dental-footer__inner { grid-template-columns: 1fr; gap: 28px; }
  .dental-footer { padding-top: 56px; }
}

@media (max-width: 480px) {
  .dental-hero__cta-group { flex-direction: column; align-items: stretch; }
  .dental-hero__cta { justify-content: center; }
  .dental-services__tabs { gap: 6px; }
  .dental-services__tab { padding: 10px 14px; font-size: 0.82rem; }
  .dental-staff__card { flex: 0 0 220px; }
}


/* --------------------------------------------------------------------------
   18. UTILITY KEYFRAMES (補完)
   -------------------------------------------------------------------------- */

@keyframes dentalFadeInUp { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes dentalSlideInLeft { from { opacity: 0; transform: translateX(-32px); } to { opacity: 1; transform: none; } }
@keyframes dentalBlurReveal { from { opacity: 0; filter: blur(16px); } to { opacity: 1; filter: blur(0); } }
@keyframes dentalPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(91,155,213,0.4); } 50% { box-shadow: 0 0 0 14px rgba(91,155,213,0); } }
@keyframes dentalShimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }
@keyframes dentalSpin { to { transform: rotate(360deg); } }
@keyframes dentalSlideUp { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: none; } }


/* --------------------------------------------------------------------------
   19. SKIP LINK (アクセシビリティ)
   -------------------------------------------------------------------------- */

.dental-skip-link {
  position: absolute;
  top: -100px;
  left: 16px;
  z-index: 999;
  padding: 12px 20px;
  background: var(--dental-primary-deep);
  color: var(--dental-base);
  border-radius: 0 0 var(--dental-radius) var(--dental-radius);
  font-weight: 700;
  text-decoration: none;
  transition: top 0.2s var(--dental-ease-snappy);
}
.dental-skip-link:focus {
  top: 0;
  outline: 3px solid var(--dental-warn);
  outline-offset: 2px;
}


/* --------------------------------------------------------------------------
   20. UTILITY CLASSES (.sr-only, .visually-hidden, etc.)
   -------------------------------------------------------------------------- */

.dental-sr-only,
.dental-visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.dental-no-scroll { overflow: hidden; }

.dental-text-center { text-align: center; }
.dental-text-right { text-align: right; }

.dental-mt-sm { margin-top: 0.5rem; }
.dental-mt-md { margin-top: 1rem; }
.dental-mt-lg { margin-top: 2rem; }
.dental-mt-xl { margin-top: 4rem; }

.dental-mb-sm { margin-bottom: 0.5rem; }
.dental-mb-md { margin-bottom: 1rem; }
.dental-mb-lg { margin-bottom: 2rem; }
.dental-mb-xl { margin-bottom: 4rem; }


/* --------------------------------------------------------------------------
   21. FAQ — アコーディオン (業種固有・将来 HTML 追加用 styles)
   -------------------------------------------------------------------------- */

.dental-faq {
  padding: var(--dental-section-py) var(--dental-px);
  background: var(--dental-base);
}
.dental-faq__inner {
  max-width: var(--dental-container-narrow);
  margin: 0 auto;
}
.dental-faq__head { text-align: center; margin-bottom: 40px; }
.dental-faq__eyebrow {
  font-family: var(--dental-font-en);
  font-size: 0.85rem;
  letter-spacing: 0.35em;
  color: var(--dental-primary-dark);
  margin: 0 0 12px;
}
.dental-faq__title { font-size: var(--dental-fs-h2); margin: 0; }

.dental-faq__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.dental-faq__item {
  background: var(--dental-surface);
  border: 1px solid var(--dental-border);
  border-radius: var(--dental-radius);
  overflow: hidden;
  transition: border-color var(--dental-dur);
}
.dental-faq__item[open] {
  border-color: var(--dental-primary);
  background: var(--dental-base);
  box-shadow: var(--dental-shadow-soft);
}
.dental-faq__summary {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 22px 28px;
  cursor: pointer;
  font-family: var(--dental-font-heading);
  font-size: 1.05rem;
  font-weight: 700;
  list-style: none;
}
.dental-faq__summary::-webkit-details-marker { display: none; }
.dental-faq__summary::before {
  content: "Q";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  background: var(--dental-primary-dark);
  color: var(--dental-base);
  border-radius: 50%;
  font-family: var(--dental-font-en);
  font-size: 0.95rem;
  letter-spacing: 0;
}
.dental-faq__summary::after {
  content: "+";
  margin-left: auto;
  font-size: 1.4rem;
  color: var(--dental-primary-dark);
  transition: transform var(--dental-dur);
}
.dental-faq__item[open] .dental-faq__summary::after {
  transform: rotate(45deg);
}
.dental-faq__body {
  padding: 0 28px 24px 80px;
  font-size: 0.95rem;
  color: var(--dental-text-sub);
  line-height: 1.85;
}
.dental-faq__body p { margin: 0 0 12px; }
.dental-faq__body p:last-child { margin-bottom: 0; }
.dental-faq__body small {
  display: block;
  margin-top: 14px;
  font-size: 0.74rem;
  color: var(--dental-text-muted);
}


/* --------------------------------------------------------------------------
   22. PATIENT VOICE — 患者の声 (業種固有・将来 HTML 用)
   -------------------------------------------------------------------------- */

.dental-voice {
  padding: var(--dental-section-py) var(--dental-px);
  background: var(--dental-surface);
}
.dental-voice__inner {
  max-width: var(--dental-container);
  margin: 0 auto;
}
.dental-voice__head { text-align: center; margin-bottom: 48px; }
.dental-voice__eyebrow {
  font-family: var(--dental-font-en);
  font-size: 0.85rem;
  letter-spacing: 0.35em;
  color: var(--dental-primary-dark);
  margin: 0 0 12px;
}
.dental-voice__title { font-size: var(--dental-fs-h2); margin: 0; }

.dental-voice__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
}
.dental-voice__card {
  position: relative;
  padding: 36px 28px 28px;
  background: var(--dental-base);
  border-radius: var(--dental-radius);
  border-top: 3px solid var(--dental-primary-dark);
  box-shadow: var(--dental-shadow-soft);
  transition: transform var(--dental-dur), box-shadow var(--dental-dur);
}
.dental-voice__card:nth-child(2n) {
  border-top-color: var(--dental-warn);
}
.dental-voice__card:nth-child(3n) {
  border-top-color: var(--dental-success);
}
.dental-voice__card:hover {
  transform: translateY(-4px) rotate(-0.5deg);
  box-shadow: var(--dental-shadow-card);
}
.dental-voice__quote {
  font-family: var(--dental-font-heading);
  font-size: 4rem;
  line-height: 1;
  color: var(--dental-primary-light);
  position: absolute;
  top: 8px;
  right: 14px;
}
.dental-voice__text {
  font-size: 0.95rem;
  line-height: 1.85;
  margin: 0 0 22px;
  color: var(--dental-text);
}
.dental-voice__meta {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 18px;
  border-top: 1px solid var(--dental-border);
  font-size: 0.82rem;
  color: var(--dental-text-sub);
}
.dental-voice__meta-age {
  font-family: var(--dental-font-en);
  font-weight: 700;
  color: var(--dental-primary-deep);
}


/* --------------------------------------------------------------------------
   23. EMERGENCY BANNER — 急患案内 (右下フローティング、業種固有)
   -------------------------------------------------------------------------- */

.dental-emergency {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 80;
  max-width: 320px;
  padding: 18px 22px;
  background: var(--dental-base);
  border-radius: var(--dental-radius);
  box-shadow: var(--dental-shadow-card);
  border-left: 4px solid var(--dental-warn);
  transform: translateY(120%);
  opacity: 0;
  transition: transform var(--dental-dur-slow) var(--dental-ease-soft),
              opacity var(--dental-dur-slow) var(--dental-ease-soft);
}
.dental-emergency.is-visible {
  transform: translateY(0);
  opacity: 1;
}
.dental-emergency__title {
  font-family: var(--dental-font-heading);
  font-size: 0.95rem;
  margin: 0 0 6px;
  color: var(--dental-warn);
  display: flex;
  align-items: center;
  gap: 8px;
}
.dental-emergency__title::before {
  content: "!";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--dental-warn);
  color: var(--dental-base);
  font-size: 0.85rem;
  font-weight: 700;
}
.dental-emergency__text {
  font-size: 0.82rem;
  color: var(--dental-text-sub);
  margin: 0 0 12px;
  line-height: 1.7;
}
.dental-emergency__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 18px;
  background: var(--dental-warn);
  color: var(--dental-base);
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  transition: background var(--dental-dur-fast);
}
.dental-emergency__cta:hover { background: #c97400; }
.dental-emergency__close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 24px;
  height: 24px;
  font-size: 0.85rem;
  color: var(--dental-text-muted);
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.dental-emergency__close:hover { color: var(--dental-text); }


/* --------------------------------------------------------------------------
   24. FOCUS-VISIBLE 詳細スタイル (アクセシビリティ強化)
   -------------------------------------------------------------------------- */

.dental-header__nav-list a:focus-visible,
.dental-header__cta:focus-visible,
.dental-hero__cta:focus-visible,
.dental-services__tab:focus-visible,
.dental-staff__nav-btn:focus-visible,
.dental-message__cta:focus-visible,
.dental-access__cta:focus-visible {
  outline: 3px solid var(--dental-warn);
  outline-offset: 4px;
  border-radius: 999px;
}

.dental-faq__summary:focus-visible {
  outline: 3px solid var(--dental-warn);
  outline-offset: -3px;
  background: var(--dental-primary-light);
}

.dental-mobile-cta__btn:focus-visible {
  outline: 3px solid var(--dental-warn);
  outline-offset: -4px;
  background: var(--dental-surface);
}


/* --------------------------------------------------------------------------
   25. PRINT STYLES (印刷時の最適化)
   -------------------------------------------------------------------------- */

@media print {
  .dental-loader,
  .dental-mobile-cta,
  .dental-emergency,
  .dental-hero__scroll,
  .dental-staff__nav,
  .dental-hero__indicators,
  .dental-header__menu-btn { display: none !important; }

  body.dental-body {
    color: #000 !important;
    background: #fff !important;
    font-size: 11pt;
    line-height: 1.6;
  }

  .dental-header {
    position: static !important;
    background: #fff !important;
    box-shadow: none !important;
    border-bottom: 1px solid #ccc;
    color: #000 !important;
  }
  .dental-header__logo, .dental-header__nav, .dental-header__actions { color: #000 !important; }
  .dental-header__cta { background: #000 !important; color: #fff !important; }

  .dental-hero {
    min-height: auto !important;
    page-break-after: always;
    color: #000 !important;
  }
  .dental-hero__overlay { display: none !important; }
  .dental-hero__media img { filter: grayscale(1); opacity: 0.5; }
  .dental-hero__title, .dental-hero__subtitle { color: #000 !important; text-shadow: none !important; }

  .dental-features__card,
  .dental-services__panel,
  .dental-staff__card,
  .dental-faq__item,
  .dental-voice__card { box-shadow: none !important; border: 1px solid #ccc !important; page-break-inside: avoid; }

  .dental-schedule__table { border: 1px solid #000 !important; }
  .dental-schedule__table th, .dental-schedule__table td { border-color: #000 !important; }

  a { color: #000 !important; text-decoration: underline !important; }
  a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 0.85em; }
  a[href^="tel:"]::after, a[href^="mailto:"]::after { content: ""; }
}


/* --------------------------------------------------------------------------
   26. DARK MODE (prefers-color-scheme: dark)
   -------------------------------------------------------------------------- */

@media (prefers-color-scheme: dark) {
  :root {
    --dental-base: #0e1620;
    --dental-surface: #16212e;
    --dental-surface-alt: #1a2837;
    --dental-text: #e6edf3;
    --dental-text-sub: #93a3b3;
    --dental-text-muted: #6b7b8a;
    --dental-border: #243345;
    --dental-border-strong: #2f4257;
    --dental-primary-light: #1a3148;
    --dental-primary-pale: #15263a;
    --dental-shadow-soft: 0 4px 16px rgba(0, 0, 0, 0.45);
    --dental-shadow-card: 0 6px 24px rgba(0, 0, 0, 0.55);
  }

  .dental-header.is-scrolled {
    background: rgba(14, 22, 32, 0.95);
  }
  .dental-header.is-scrolled .dental-header__logo,
  .dental-header.is-scrolled .dental-header__nav,
  .dental-header.is-scrolled .dental-header__actions {
    color: var(--dental-text);
  }

  .dental-news__item:hover { background: rgba(91, 155, 213, 0.08); }

  .dental-features__card { background: var(--dental-surface); }
  .dental-features__card:hover { background: var(--dental-surface-alt); }

  .dental-message {
    background: linear-gradient(135deg, var(--dental-primary-pale) 0%, var(--dental-base) 50%);
  }
  .dental-message__name-card { background: var(--dental-surface); }

  .dental-services__panel { background: var(--dental-surface); }
  .dental-services__tab { background: var(--dental-surface); color: var(--dental-text-sub); }

  .dental-staff__card { background: var(--dental-surface); }
  .dental-staff__nav-btn { background: var(--dental-surface); color: var(--dental-primary); border-color: var(--dental-border); }

  .dental-schedule__table { background: var(--dental-surface); }
  .dental-schedule__table tbody th { background: var(--dental-surface-alt); color: var(--dental-text-sub); }

  .dental-faq__item { background: var(--dental-surface); }
  .dental-voice__card { background: var(--dental-surface); }

  .dental-emergency { background: var(--dental-surface); }
  .dental-emergency__close:hover { color: var(--dental-text); }

  .dental-mobile-cta { background: var(--dental-surface); border-top-color: var(--dental-border); }
}


/* --------------------------------------------------------------------------
   27. HIGH-CONTRAST MODE (forced-colors / 高コントラスト)
   -------------------------------------------------------------------------- */

@media (forced-colors: active) {
  .dental-features__card,
  .dental-services__panel,
  .dental-staff__card,
  .dental-faq__item,
  .dental-voice__card { border: 2px solid CanvasText; box-shadow: none; }

  .dental-header__cta,
  .dental-hero__cta--primary,
  .dental-message__cta,
  .dental-access__cta { border: 2px solid CanvasText; }

  .dental-schedule__table { border: 2px solid CanvasText; }
}


/* --------------------------------------------------------------------------
   28. CONTAINER QUERIES — 細かい補完
   -------------------------------------------------------------------------- */

.dental-hero { container-type: inline-size; container-name: dental-hero; }
.dental-features__inner { container-type: inline-size; container-name: dental-features; }
.dental-services__inner { container-type: inline-size; container-name: dental-services; }
.dental-message__inner { container-type: inline-size; container-name: dental-message; }
.dental-access__inner { container-type: inline-size; container-name: dental-access; }

@container dental-features (max-width: 600px) {
  .dental-features__grid { grid-template-columns: 1fr; gap: 16px; }
  .dental-features__card { padding: 28px 24px; }
}

@container dental-services (max-width: 700px) {
  .dental-services__panel { padding: 28px 22px; }
  .dental-services__detail { grid-template-columns: 1fr; }
  .dental-services__detail div { padding: 12px 0; border-bottom: 1px dashed var(--dental-border); }
  .dental-services__detail div:last-child { border-bottom: 0; }
}

@container dental-message (max-width: 700px) {
  .dental-message__name-card {
    position: static;
    margin-top: -40px;
    margin-left: auto;
    margin-right: auto;
    width: fit-content;
  }
}

@container dental-access (max-width: 700px) {
  .dental-access__route { grid-template-columns: 1fr; gap: 6px; }
  .dental-access__route dt { font-size: 0.85rem; }
}


/* --------------------------------------------------------------------------
   29. ANIMATION TIMING / EASE 拡張
   -------------------------------------------------------------------------- */

.dental-anim--delay-1 { transition-delay: 80ms; }
.dental-anim--delay-2 { transition-delay: 160ms; }
.dental-anim--delay-3 { transition-delay: 240ms; }
.dental-anim--delay-4 { transition-delay: 320ms; }
.dental-anim--delay-5 { transition-delay: 400ms; }
.dental-anim--delay-6 { transition-delay: 480ms; }


/* --------------------------------------------------------------------------
   30. LOADING SPINNER (フォーム送信中・将来用)
   -------------------------------------------------------------------------- */

.dental-spinner {
  display: inline-block;
  width: 18px;
  height: 18px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: dentalSpin 0.8s linear infinite;
  vertical-align: middle;
}

.dental-skeleton {
  background: linear-gradient(90deg, var(--dental-surface) 0%, var(--dental-primary-light) 50%, var(--dental-surface) 100%);
  background-size: 200% 100%;
  animation: dentalShimmer 1.6s ease-in-out infinite;
  border-radius: var(--dental-radius-sm);
  color: transparent;
  user-select: none;
}


/* --------------------------------------------------------------------------
   31. BUTTON VARIANTS 拡張
   -------------------------------------------------------------------------- */

.dental-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: 999px;
  font-family: var(--dental-font-body);
  font-weight: 700;
  font-size: 0.95rem;
  letter-spacing: 0.06em;
  transition: transform var(--dental-dur-fast),
              background-color var(--dental-dur-fast),
              color var(--dental-dur-fast),
              box-shadow var(--dental-dur-fast);
  cursor: pointer;
  border: 1.5px solid transparent;
}
.dental-btn--primary {
  background: var(--dental-primary-dark);
  color: var(--dental-base);
  box-shadow: var(--dental-shadow-cta);
}
.dental-btn--primary:hover { background: var(--dental-primary-deep); transform: translateY(-2px); }
.dental-btn--ghost {
  background: transparent;
  color: var(--dental-primary-deep);
  border-color: var(--dental-primary-dark);
}
.dental-btn--ghost:hover { background: var(--dental-primary-dark); color: var(--dental-base); }
.dental-btn--warn { background: var(--dental-warn); color: var(--dental-base); }
.dental-btn--warn:hover { background: #c97400; transform: translateY(-2px); }
.dental-btn--lg { padding: 18px 36px; font-size: 1.05rem; }
.dental-btn--sm { padding: 8px 16px; font-size: 0.82rem; }
.dental-btn--block { display: flex; width: 100%; }


/* --------------------------------------------------------------------------
   32. NEWS TAG 詳細バリエーション
   -------------------------------------------------------------------------- */

.dental-news__tag--info { background: #e0f2fe; color: #075985; }
.dental-news__tag--blog { background: #f0fdf4; color: #166534; }
.dental-news__tag--press { background: #fdf4ff; color: #86198f; }
.dental-news__tag--recruit { background: #fef9c3; color: #854d0e; }


/* --------------------------------------------------------------------------
   33. STAFF 拡張 — 担当領域バッジ
   -------------------------------------------------------------------------- */

.dental-staff__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0 22px 18px;
}
.dental-staff__tag {
  display: inline-block;
  padding: 4px 10px;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  background: var(--dental-primary-light);
  color: var(--dental-primary-deep);
  border-radius: 4px;
}


/* --------------------------------------------------------------------------
   34. SCHEDULE 拡張 — 当月カレンダー (将来用 styles)
   -------------------------------------------------------------------------- */

.dental-month {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 2px;
  font-family: var(--dental-font-body);
  margin-top: 28px;
  background: var(--dental-base);
  border-radius: var(--dental-radius);
  overflow: hidden;
  box-shadow: var(--dental-shadow-soft);
}
.dental-month__cell {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 10px 6px;
  background: var(--dental-surface);
  font-size: 0.82rem;
  min-height: 60px;
  position: relative;
}
.dental-month__cell--today { background: var(--dental-primary-light); font-weight: 700; }
.dental-month__cell--off { color: var(--dental-text-muted); background: var(--dental-surface-alt); }
.dental-month__cell--sun { color: var(--dental-danger); }


/* --------------------------------------------------------------------------
   35. アニメーションオプション (entry/exit)
   -------------------------------------------------------------------------- */

.dental-anim--scale { transform: scale(0.92); }
.dental-anim--scale.is-inview { transform: scale(1); }

.dental-anim--rotate { transform: rotate(-2deg) translateY(20px); }
.dental-anim--rotate.is-inview { transform: rotate(0) translateY(0); }

.dental-anim--clip { clip-path: inset(0 100% 0 0); }
.dental-anim--clip.is-inview { clip-path: inset(0 0 0 0); transition: clip-path 1.2s var(--dental-ease-dramatic); }


/* --------------------------------------------------------------------------
   36. RESPONSIVE 拡張 (xl, sp 詳細)
   -------------------------------------------------------------------------- */

@media (min-width: 1280px) {
  :root {
    --dental-section-py: 144px;
    --dental-fs-h1: clamp(2.4rem, 5.5vw, 3.75rem);
    --dental-fs-h2: clamp(1.8rem, 3.5vw, 2.5rem);
  }
  .dental-hero__inner { padding-bottom: 60px; }
  .dental-features__grid { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 360px) {
  .dental-header__cta { padding: 9px 14px; font-size: 0.78rem; }
  .dental-hero__badges li { padding: 8px 12px; font-size: 0.75rem; }
  .dental-services__tab { padding: 8px 12px; font-size: 0.78rem; }
}


/* --------------------------------------------------------------------------
   37. SUB-PAGE COMPONENTS — page-hero / breadcrumb / prose / form / toc
   -------------------------------------------------------------------------- */

/* --- Page Hero (slim, below header) --- */

.dental-page-hero {
  position: relative;
  padding: clamp(140px, 22vh, 220px) var(--dental-px) clamp(48px, 6vh, 72px);
  background: linear-gradient(to bottom, var(--dental-primary-deep) 0%, #2a6e9d 100%);
  color: var(--dental-base);
  overflow: hidden;
  isolation: isolate;
}
.dental-page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(circle at 80% 20%, rgba(255,255,255,0.08), transparent 50%);
}
.dental-page-hero__inner {
  max-width: var(--dental-container);
  margin: 0 auto;
}
.dental-page-hero__eyebrow {
  font-family: var(--dental-font-en);
  font-size: 0.78rem;
  letter-spacing: 0.4em;
  margin: 0 0 14px;
  opacity: 0.75;
  text-transform: uppercase;
}
.dental-page-hero__title {
  font-family: var(--dental-font-heading);
  font-size: clamp(1.8rem, 4.5vw, 2.8rem);
  margin: 0 0 16px;
  line-height: 1.4;
  letter-spacing: 0.04em;
}
.dental-page-hero__lead {
  font-size: 1rem;
  line-height: 1.85;
  opacity: 0.92;
  max-width: 960px;
  margin: 0;
}

/* --- Breadcrumb --- */

.dental-bread {
  background: var(--dental-surface);
  border-bottom: 1px solid var(--dental-border);
  padding: 14px var(--dental-px);
}
.dental-bread__inner {
  max-width: var(--dental-container);
  margin: 0 auto;
  font-family: var(--dental-font-body);
  font-size: 0.82rem;
  color: var(--dental-text-sub);
}
.dental-bread__inner ol { list-style: none; padding: 0; margin: 0; display: flex; gap: 10px; flex-wrap: wrap; }
.dental-bread__inner li { display: inline-flex; align-items: center; gap: 10px; }
.dental-bread__inner li::after { content: "/"; color: var(--dental-text-muted); margin-left: 10px; }
.dental-bread__inner li:last-child::after { display: none; }
.dental-bread__inner a { color: var(--dental-primary-dark); transition: color var(--dental-dur-fast); }
.dental-bread__inner a:hover { color: var(--dental-primary-deep); }
.dental-bread__inner li[aria-current] { color: var(--dental-text); font-weight: 500; }

/* --- Prose (content-heavy pages: about / news / legal) --- */

.dental-prose {
  max-width: var(--dental-container-narrow);
  margin: 0 auto;
  padding: clamp(56px, 8vh, 96px) var(--dental-px);
  font-size: 1rem;
  line-height: 1.95;
  color: var(--dental-text);
}
.dental-prose h2 {
  font-family: var(--dental-font-heading);
  font-size: clamp(1.4rem, 3vw, 1.85rem);
  margin: 56px 0 20px;
  padding-bottom: 14px;
  border-bottom: 2px solid var(--dental-primary);
  line-height: 1.5;
}
.dental-prose h2:first-child { margin-top: 0; }
.dental-prose h3 {
  font-family: var(--dental-font-heading);
  font-size: 1.15rem;
  margin: 32px 0 12px;
  color: var(--dental-primary-deep);
  line-height: 1.55;
}
.dental-prose p { margin: 0 0 18px; }
.dental-prose strong { font-weight: 700; color: var(--dental-primary-deep); }
.dental-prose ul, .dental-prose ol { margin: 0 0 22px; padding-left: 1.4em; }
.dental-prose li { margin-bottom: 8px; }
.dental-prose a { color: var(--dental-primary-dark); border-bottom: 1px solid currentColor; }
.dental-prose a:hover { color: var(--dental-primary-deep); }
.dental-prose blockquote {
  margin: 28px 0;
  padding: 22px 28px;
  background: var(--dental-primary-pale);
  border-left: 4px solid var(--dental-primary);
  font-style: normal;
  color: var(--dental-text-sub);
}
.dental-prose hr { border: 0; border-top: 1px solid var(--dental-border); margin: 48px 0; }
.dental-prose small { font-size: 0.8rem; color: var(--dental-text-muted); }
.dental-prose .dental-prose__lead {
  font-size: 1.1rem;
  font-weight: 500;
  color: var(--dental-primary-deep);
  margin-bottom: 32px;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--dental-border);
  line-height: 1.85;
}

/* --- Table (about, services, etc.) --- */

.dental-table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0 32px;
  background: var(--dental-base);
  border: 1px solid var(--dental-border);
  font-size: 0.92rem;
}
.dental-table th, .dental-table td {
  padding: 14px 18px;
  border-bottom: 1px solid var(--dental-border);
  text-align: left;
  vertical-align: top;
}
.dental-table th {
  background: var(--dental-surface);
  font-weight: 700;
  width: 30%;
  color: var(--dental-primary-deep);
  letter-spacing: 0.04em;
}
.dental-table tr:last-child th, .dental-table tr:last-child td { border-bottom: 0; }

/* --- Form (contact / recruit) --- */

.dental-form { max-width: 720px; margin: 0 auto; }
.dental-form__row { display: grid; grid-template-columns: 200px 1fr; gap: 24px; padding: 22px 0; border-bottom: 1px solid var(--dental-border); align-items: start; }
.dental-form__row:last-of-type { border-bottom: 0; }
.dental-form__row label {
  font-family: var(--dental-font-heading);
  font-size: 0.95rem;
  color: var(--dental-primary-deep);
  padding-top: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.dental-form__required {
  display: inline-flex;
  font-size: 0.7rem;
  background: var(--dental-warn);
  color: var(--dental-base);
  padding: 2px 6px;
  border-radius: 3px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.dental-form__field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.dental-form__field input,
.dental-form__field textarea,
.dental-form__field select {
  font: inherit;
  padding: 12px 14px;
  border: 1px solid var(--dental-border);
  border-radius: var(--dental-radius-sm);
  background: var(--dental-base);
  color: var(--dental-text);
  width: 100%;
  transition: border-color var(--dental-dur-fast);
}
.dental-form__field input:focus,
.dental-form__field textarea:focus,
.dental-form__field select:focus {
  outline: 0;
  border-color: var(--dental-primary-dark);
  box-shadow: 0 0 0 3px var(--dental-primary-light);
}
.dental-form__hint {
  font-size: 0.78rem;
  color: var(--dental-text-muted);
}
.dental-form__check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 0.9rem;
}
.dental-form__check input[type="checkbox"],
.dental-form__check input[type="radio"] {
  width: auto;
  flex-shrink: 0;
  margin-top: 4px;
  padding: 0;
}
.dental-form__check span { flex: 1; min-width: 0; }
.dental-form__submit-row {
  display: flex;
  justify-content: center;
  margin: 36px 0 0;
}
.dental-form__submit {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 18px 56px;
  background: var(--dental-primary-dark);
  color: var(--dental-base);
  border-radius: 999px;
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: 0.06em;
  cursor: pointer;
  transition: background var(--dental-dur-fast), transform var(--dental-dur-fast);
}
.dental-form__submit:hover { background: var(--dental-primary-deep); transform: translateY(-2px); }

/* --- TOC (legal, faq) --- */

.dental-toc {
  background: var(--dental-primary-pale);
  border-left: 3px solid var(--dental-primary);
  padding: 22px 28px;
  margin: 0 0 36px;
  font-size: 0.9rem;
}
.dental-toc__title { font-family: var(--dental-font-heading); font-size: 0.95rem; margin: 0 0 12px; color: var(--dental-primary-deep); }
.dental-toc ul { list-style: none; padding: 0; margin: 0; }
.dental-toc li { margin-bottom: 6px; }
.dental-toc a { color: var(--dental-primary-deep); border-bottom: 1px dashed currentColor; transition: color var(--dental-dur-fast); }
.dental-toc a:hover { color: var(--dental-primary-dark); }

/* --- Side Page CTA --- */

.dental-page-cta {
  margin: 56px 0;
  padding: 40px 32px;
  background: var(--dental-primary-deep);
  color: var(--dental-base);
  border-radius: var(--dental-radius-lg);
  text-align: center;
}
.dental-page-cta h3 { font-family: var(--dental-font-heading); font-size: 1.4rem; margin: 0 0 14px; color: var(--dental-base); }
.dental-page-cta p { margin: 0 0 24px; opacity: 0.9; line-height: 1.85; font-size: 0.95rem; }
.dental-page-cta__btns { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; }
.dental-page-cta__btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 14px 30px;
  border-radius: 999px;
  font-weight: 700; font-size: 0.95rem; letter-spacing: 0.06em;
  transition: background var(--dental-dur-fast);
}
.dental-page-cta__btn--primary { background: var(--dental-warn); color: var(--dental-base); }
.dental-page-cta__btn--primary:hover { background: #c97400; }
.dental-page-cta__btn--ghost { background: transparent; color: var(--dental-base); border: 1px solid rgba(255,255,255,0.5); }
.dental-page-cta__btn--ghost:hover { background: rgba(255,255,255,0.12); }

/* --- Cards Grid (services / faq) --- */

.dental-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
}

.dental-card {
  padding: 28px 26px;
  background: var(--dental-base);
  border: 1px solid var(--dental-border);
  border-radius: var(--dental-radius);
  transition: border-color var(--dental-dur), transform var(--dental-dur), box-shadow var(--dental-dur);
}
.dental-card:hover { border-color: var(--dental-primary); transform: translateY(-3px); box-shadow: var(--dental-shadow-soft); }
.dental-card__title { font-family: var(--dental-font-heading); font-size: 1.1rem; margin: 0 0 12px; color: var(--dental-primary-deep); }
.dental-card__text { margin: 0; font-size: 0.92rem; color: var(--dental-text-sub); line-height: 1.85; }


/* --- Responsive for sub pages --- */
@media (max-width: 768px) {
  .dental-form__row { grid-template-columns: 1fr; gap: 8px; padding: 14px 0; }
  .dental-form__row label { padding-top: 0; }
  .dental-page-hero { padding-top: 110px; padding-bottom: 36px; }
  .dental-page-hero__title { font-size: clamp(1.5rem, 6vw, 2rem); }
  .dental-page-hero__lead { font-size: 0.92rem; }
  .dental-bread { padding: 10px var(--dental-px); }
  .dental-bread__inner { font-size: 0.78rem; }
  .dental-prose { padding-top: 48px; padding-bottom: 64px; font-size: 0.95rem; }
  .dental-prose h2 { font-size: 1.3rem; margin-top: 40px; }
  .dental-prose h3 { font-size: 1.05rem; margin-top: 24px; }
  .dental-table { font-size: 0.85rem; }
  .dental-table th, .dental-table td { padding: 10px 12px; }
  .dental-table th { width: 35%; }
  .dental-page-cta { padding: 28px 22px; margin: 36px 0; }
  .dental-page-cta h3 { font-size: 1.15rem; }
  .dental-page-cta p { font-size: 0.9rem; }
  .dental-page-cta__btns { flex-direction: column; gap: 10px; }
  .dental-page-cta__btn { width: 100%; justify-content: center; }
  .dental-grid { grid-template-columns: 1fr; }
  .dental-toc { padding: 18px 22px; }
}

/* 横スクロール用 wrapper (将来の data table 対策) */
.dental-table-scroll { overflow-x: auto; margin: 24px 0 32px; -webkit-overflow-scrolling: touch; }
.dental-table-scroll .dental-table { margin: 0; min-width: 520px; }

/* breadcrumb 1行に強制 */
.dental-bread__inner ol { white-space: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 2px; }

/* --------------------------------------------------------------------------
   39. NEWS LIST / ARTICLE — ブログ感を回避する視覚設計
   -------------------------------------------------------------------------- */

/* カテゴリチップ */
.dental-news-filter {
  max-width: var(--dental-container);
  margin: 0 auto;
  padding: 32px var(--dental-px) 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}
.dental-news-filter__chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  background: var(--dental-surface);
  border: 1px solid var(--dental-border);
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--dental-text-sub);
  transition: all var(--dental-dur-fast);
  cursor: pointer;
}
.dental-news-filter__chip:hover { border-color: var(--dental-primary); color: var(--dental-primary-deep); }
.dental-news-filter__chip.is-active { background: var(--dental-primary-dark); color: var(--dental-base); border-color: var(--dental-primary-dark); }

/* news 一覧カードグリッド */
.dental-news-list {
  max-width: var(--dental-container);
  margin: 0 auto;
  padding: clamp(40px, 6vh, 64px) var(--dental-px);
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 28px;
}
.dental-news-list__featured {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 0;
  background: var(--dental-base);
  border-radius: var(--dental-radius);
  overflow: hidden;
  box-shadow: var(--dental-shadow-card);
}
@media (max-width: 768px) {
  .dental-news-list__featured { grid-template-columns: 1fr; }
}
.dental-news-list__featured-media { position: relative; aspect-ratio: 16/10; overflow: hidden; }
.dental-news-list__featured-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--dental-ease-soft); }
.dental-news-list__featured:hover .dental-news-list__featured-media img { transform: scale(1.05); }
.dental-news-list__featured-body { padding: 36px 40px; display: flex; flex-direction: column; justify-content: center; }
.dental-news-list__featured-eyebrow {
  font-family: var(--dental-font-en);
  font-size: 0.72rem;
  letter-spacing: 0.4em;
  color: var(--dental-warn);
  font-weight: 700;
  margin: 0 0 14px;
}
.dental-news-list__featured-body h3 {
  font-family: var(--dental-font-heading);
  font-size: clamp(1.3rem, 2.4vw, 1.7rem);
  margin: 0 0 16px;
  line-height: 1.5;
}
.dental-news-list__featured-body p { color: var(--dental-text-sub); margin: 0 0 22px; line-height: 1.85; font-size: 0.95rem; }
.dental-news-list__featured-meta { display: flex; gap: 14px; align-items: center; font-size: 0.82rem; color: var(--dental-text-muted); }
.dental-news-list__featured-meta time { font-family: var(--dental-font-en); }
.dental-news-list__featured-link { display: inline-flex; align-items: center; gap: 6px; color: var(--dental-primary-dark); font-weight: 600; }

/* 通常 news カード */
.dental-news-card {
  display: block;
  background: var(--dental-base);
  border-radius: var(--dental-radius);
  overflow: hidden;
  border: 1px solid var(--dental-border);
  transition: transform var(--dental-dur), box-shadow var(--dental-dur);
}
.dental-news-card:hover { transform: translateY(-4px); box-shadow: var(--dental-shadow-card); }
.dental-news-card__media { position: relative; aspect-ratio: 16/10; overflow: hidden; }
.dental-news-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s var(--dental-ease-soft); }
.dental-news-card:hover .dental-news-card__media img { transform: scale(1.06); }
.dental-news-card__cat {
  position: absolute;
  top: 12px; left: 12px;
  padding: 4px 12px;
  background: var(--dental-base);
  color: var(--dental-primary-deep);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  border-radius: 4px;
}
.dental-news-card__cat--alert { background: var(--dental-warn); color: var(--dental-base); }
.dental-news-card__body { padding: 22px 24px 26px; }
.dental-news-card__date { font-family: var(--dental-font-en); font-size: 0.85rem; color: var(--dental-text-sub); margin: 0 0 8px; letter-spacing: 0.06em; }
.dental-news-card__title { font-family: var(--dental-font-heading); font-size: 1.05rem; margin: 0 0 12px; line-height: 1.55; color: var(--dental-text); }
.dental-news-card__excerpt { font-size: 0.88rem; color: var(--dental-text-sub); margin: 0; line-height: 1.75; }

/* 個別記事 — featured image hero */
.dental-article-hero {
  position: relative;
  padding: clamp(140px, 22vh, 220px) var(--dental-px) clamp(60px, 8vh, 100px);
  background: var(--dental-bg-deep, #0f1b2d);
  color: var(--dental-base);
  overflow: hidden;
  isolation: isolate;
}
.dental-article-hero__bg { position: absolute; inset: 0; z-index: -2; }
.dental-article-hero__bg img { width: 100%; height: 100%; object-fit: cover; opacity: 0.35; }
.dental-article-hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(15,30,55,0.7) 0%, rgba(15,30,55,0.92) 100%);
}
.dental-article-hero__inner { max-width: var(--dental-container-narrow); margin: 0 auto; }
.dental-article-hero__cat {
  display: inline-block;
  padding: 5px 14px;
  background: var(--dental-warn);
  color: var(--dental-base);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  border-radius: 4px;
  margin-bottom: 18px;
}
.dental-article-hero__title { font-family: var(--dental-font-heading); font-size: clamp(1.7rem, 4vw, 2.6rem); margin: 0 0 22px; line-height: 1.45; }
.dental-article-hero__meta { display: flex; gap: 24px; align-items: center; font-size: 0.85rem; opacity: 0.85; flex-wrap: wrap; }
.dental-article-hero__meta time { font-family: var(--dental-font-en); letter-spacing: 0.06em; }
.dental-article-hero__meta-author { display: inline-flex; align-items: center; gap: 8px; }
.dental-article-hero__avatar { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }

/* 記事本文の callout (重要情報) */
.dental-callout {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: 16px;
  padding: 20px 24px;
  background: var(--dental-warn-bg);
  border-left: 4px solid var(--dental-warn);
  border-radius: var(--dental-radius-sm);
  margin: 24px 0;
}
.dental-callout--info { background: var(--dental-primary-light); border-left-color: var(--dental-primary); }
.dental-callout__icon { display: flex; align-items: flex-start; color: var(--dental-warn); font-size: 1.5rem; font-weight: 700; }
.dental-callout--info .dental-callout__icon { color: var(--dental-primary-dark); }
.dental-callout__title { font-weight: 700; margin: 0 0 6px; color: var(--dental-text); }
.dental-callout p { margin: 0; font-size: 0.92rem; line-height: 1.85; color: var(--dental-text-sub); }

/* 関連記事 */
.dental-related {
  background: var(--dental-surface);
  padding: clamp(48px, 7vh, 80px) var(--dental-px);
}
.dental-related__inner { max-width: var(--dental-container); margin: 0 auto; }
.dental-related__title {
  font-family: var(--dental-font-heading);
  font-size: 1.4rem;
  text-align: center;
  margin: 0 0 36px;
  position: relative;
  display: block;
}
.dental-related__title::after {
  content: "";
  display: block;
  width: 36px; height: 2px;
  background: var(--dental-primary);
  margin: 14px auto 0;
}
.dental-related__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; }

/* Drop cap (記事先頭) */
.dental-prose .dental-prose__drop::first-letter {
  font-family: var(--dental-font-heading);
  font-size: 3.4rem;
  font-weight: 700;
  float: left;
  line-height: 0.85;
  margin: 6px 12px 0 0;
  color: var(--dental-primary-deep);
}


/* --------------------------------------------------------------------------
   37. WP Block FSE Header & Navigation
   -------------------------------------------------------------------------- */

html { overflow-x: hidden; }
.wp-site-blocks { overflow-x: hidden; }

.irodori-header {
  position: sticky;
  top: 0; left: 0; right: 0;
  width: 100%;
  z-index: 800;
  background: transparent;
  color: #fff;
  transition: background 0.4s ease, box-shadow 0.4s ease, color 0.4s ease;
}
.irodori-header.is-scrolled {
  background: rgba(255, 255, 255, 0.96);
  box-shadow: var(--dental-shadow-soft);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: var(--dental-text);
}
.irodori-header__inner {
  height: 72px;
  padding: 0 clamp(20px, 4vw, 48px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.irodori-header__logo .wp-block-site-logo img {
  max-height: 44px;
  width: auto;
}

.irodori-header .wp-block-navigation-item__content {
  color: inherit;
  text-decoration: none;
  font-size: 13px;
  letter-spacing: 0.06em;
  padding: 6px 10px;
  transition: opacity 0.2s;
  white-space: nowrap;
}
.irodori-header .wp-block-navigation-item__content:hover { opacity: 0.7; }
.irodori-header .wp-block-navigation .wp-block-navigation-item { list-style: none; }

.irodori-header__cta-btn {
  display: inline-flex;
  align-items: center;
  padding: 10px 22px;
  background: var(--dental-primary-dark);
  color: #fff !important;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  white-space: nowrap;
  text-decoration: none;
  transition: background 0.2s;
}
.irodori-header__cta-btn:hover { background: var(--dental-primary-deep); }

.irodori-header .wp-block-navigation__responsive-container-open,
.irodori-header .wp-block-navigation__responsive-container-close { display: none !important; }
.irodori-header .wp-block-navigation__responsive-container {
  display: contents !important;
  background: none !important;
}

.wp-site-blocks > * + * { margin-block-start: 0 !important; }
footer .wp-block-navigation { flex-direction: column !important; }

.wp-block-group.irodori-section.is-layout-constrained > *,
.wp-block-group.irodori-section > * {
  max-width: 100% !important;
  width: 100%;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.wp-block-post-content > .wp-block-group.irodori-section,
.wp-block-post-content > .wp-block-group.irodori-section + .wp-block-group.irodori-section {
  margin-block: 0;
}

@media (max-width: 1100px) {
  .irodori-header__toggle {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 6px;
    width: 34px;
    height: 34px;
    cursor: pointer;
    position: relative;
    z-index: 10001;
    flex-shrink: 0;
  }
  .irodori-header__toggle span {
    display: block;
    width: 22px;
    height: 1.8px;
    background: currentColor;
    transition: transform 0.3s ease, opacity 0.3s ease;
  }
  .irodori-header__toggle-input { display: none; }
  .wp-block-group.irodori-header__nav {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(255, 255, 255, 0.98);
    z-index: 10000;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 40px;
  }
  #irodori-nav-toggle:checked ~ .wp-block-group.irodori-header__nav { display: flex; }
  #irodori-nav-toggle:checked ~ label.irodori-header__toggle span:nth-child(1) {
    transform: translateY(7.8px) rotate(45deg);
  }
  #irodori-nav-toggle:checked ~ label.irodori-header__toggle span:nth-child(2) { opacity: 0; }
  #irodori-nav-toggle:checked ~ label.irodori-header__toggle span:nth-child(3) {
    transform: translateY(-7.8px) rotate(-45deg);
  }
  .irodori-header--hamburger .irodori-header__nav .wp-block-navigation {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    width: 100%;
  }
  .irodori-header--hamburger .irodori-header__nav .wp-block-navigation__container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem;
    list-style: none;
    margin: 0;
    padding: 0;
  }
  .irodori-header--hamburger .irodori-header__nav .wp-block-navigation__container a {
    font-size: clamp(18px, 4vw, 24px);
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--dental-primary-deep);
  }
  .irodori-header__cta { margin-top: 32px; }
}

/* --------------------------------------------------------------------------
   38. END
   -------------------------------------------------------------------------- */

/* ===== WP 7.0 Bug Fixes ===== */

/* ---------------------------------------------------------------
   WP 7.0 Fix: ナビゲーション デスクトップ表示強制
   親テーマ .irodori-header--hamburger が position:fixed/opacity:0 を
   全ブレークポイントに適用するため !important で解除
   --------------------------------------------------------------- */
@media (min-width: 1101px) {
  .irodori-header .wp-block-group.irodori-header__nav {
    position: relative !important;
    opacity: 1 !important;
    visibility: visible !important;
    inset: auto !important;
    background: none !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 24px !important;
    padding: 0 !important;
    z-index: auto !important;
  }
  .irodori-header__toggle {
    display: none !important;
  }
}

/* ---------------------------------------------------------------
   WP 7.0 Fix: ヒーロー背景 全幅解除
   WP is-layout-constrained が max-width:1280px/margin:auto を
   hero bg 要素に適用するため強制解除
   --------------------------------------------------------------- */
.is-layout-constrained > [class*="-hero__bg"],
.is-layout-constrained > [class*="-hero-bg"],
.is-layout-constrained > [class*="-hero__slide"],
.is-layout-constrained > [class*="-hero__image"],
.is-layout-constrained > [class*="-hero__visual"] {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}