/*
 * OSTEO Service — Shared Styles
 * service.osteo.co.jp 共通スタイル（ミニヘッダー・フッター）
 */

/* ─── Brand Variables ─── */
:root {
  --os-gold:    #c8972f;
  --os-gold-l:  #ddb74f;
  --os-brown:   #2d1a08;
  --os-brown-m: #5a3418;
  --os-beige:   #f5f0e8;
  --os-white:   #ffffff;
  --os-font-h:  'Lora', 'Noto Serif JP', Georgia, serif;
  --os-font-b:  'Noto Serif JP', 'Hiragino Kaku Gothic ProN', sans-serif;
  --os-radius:  8px;
  --os-trans:   250ms ease;
}

/* ─── Minimal Back Header ─── */
.os-mini-nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
  height: 36px;
  padding: 0 clamp(1rem, 4vw, 2rem);
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgba(250, 244, 232, 0.90);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(200,151,47,0.18);
}
.os-mini-nav__logo {
  font-family: var(--os-font-h);
  font-size: 0.82rem;
  font-weight: 400;
  letter-spacing: 0.22em;
  color: #2d1a08;
  text-decoration: none;
  transition: color var(--os-trans);
}
.os-mini-nav__logo sup {
  color: var(--os-gold);
  font-size: 0.55em;
}
.os-mini-nav__logo:hover { color: var(--os-gold); }
.os-mini-nav__back {
  font-family: var(--os-font-b);
  font-size: 0.68rem;
  color: rgba(45, 26, 8, 0.45);
  text-decoration: none;
  letter-spacing: 0.06em;
  transition: color var(--os-trans);
}
.os-mini-nav__back:hover { color: #2d1a08; }

/* ─── Service Footer ─── */
.os-footer {
  background: linear-gradient(135deg, #1e0e04 0%, #2d1a08 50%, #3d2310 100%);
  border-top: 1px solid rgba(200,151,47,0.2);
  padding: 2.5rem 0 1.5rem;
  color: rgba(255,255,255,0.6);
}
.os-footer__inner {
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 2rem);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 2rem;
  flex-wrap: wrap;
  margin-bottom: 1.5rem;
}
.os-footer__brand {
  font-family: var(--os-font-h);
  font-size: 1.1rem;
  letter-spacing: 0.2em;
  color: rgba(255,255,255,0.9);
}
.os-footer__brand sup { color: var(--os-gold); font-size: 0.55em; }
.os-footer__brand p {
  font-family: var(--os-font-b);
  font-size: 0.72rem;
  color: rgba(255,255,255,0.45);
  margin-top: 0.4rem;
  line-height: 1.8;
  font-weight: 300;
}
.os-footer__links {
  display: flex;
  gap: 1.2rem;
  flex-wrap: wrap;
  list-style: none;
  margin: 0; padding: 0;
}
.os-footer__links a {
  font-size: 0.72rem;
  color: rgba(255,255,255,0.38);
  text-decoration: none;
  letter-spacing: 0.05em;
  transition: color var(--os-trans);
}
.os-footer__links a:hover { color: var(--os-gold); }
.os-footer__copy {
  width: 100%;
  max-width: 1200px;
  margin-inline: auto;
  padding-inline: clamp(1rem, 4vw, 2rem);
  font-size: 0.65rem;
  color: rgba(255,255,255,0.18);
  letter-spacing: 0.07em;
  border-top: 1px solid rgba(255,255,255,0.06);
  padding-top: 1rem;
}