/* ヘッダー・フッター共通スタイル（terms.html・privacy.htmlで共有）。
   index.htmlはdc-runtime形式のため取り込めず、値は手動で追随させる必要がある。
   見た目を変える場合はここを直し、partials/header.html・footer.htmlとあわせて
   tool/lp/build-legal-pages.pyを実行すること。
   ★ 2026-10-06：利用側（terms・privacy・company-terms の <head>、source/aioris/scripts/build-lp-help.ts）は
     site-chrome.css?v=20261006 で読む（ブラウザに古いCSSが残らないように）。このファイルを変えたら v の値も上げること。
     ヘルプ（help.html・help/*.html）も同じヘッダー・フッターを使うので、source/aioris で npx tsx scripts/build-lp-help.ts も実行する。 */

header.site { position: sticky; top: 0; z-index: 100; background: rgba(22,22,22,0.88); backdrop-filter: blur(10px); border-bottom: 1px solid #1d1d1d; }
.header-inner { width: 100%; max-width: 1920px; margin: 0 auto; padding: 0 clamp(40px, 5.2vw, 100px); box-sizing: border-box; height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.header-inner img { display: block; height: 46px; width: auto; filter: invert(1); }
nav.main-nav { display: flex; align-items: center; gap: 26px; white-space: nowrap; }
nav.main-nav a { font-size: 13px; letter-spacing: 0.03em; color: #cccccc; font-weight: 700; }
nav.main-nav a.cta { display: flex; align-items: center; padding: 7px 13px; border-radius: 5px; background: #eeeeee; color: #161616; font-weight: 500; }
.demo-cta-wrap { position: relative; display: inline-flex; }
.demo-cta { display: flex; align-items: center; padding: 10px 18px; border-radius: 5px; background: #202020; color: #999999; font-size: 14px; font-weight: 500; letter-spacing: 0.03em; white-space: nowrap; cursor: default; }
.demo-cta-badge { position: absolute; top: -9px; right: -9px; padding: 2px 7px; border-radius: 999px; background: #eeeeee; color: #161616; font-size: 10px; font-weight: 700; letter-spacing: 0.02em; line-height: 1.5; white-space: nowrap; box-shadow: 0 0 0 2px #161616; }
.drawer-demo-wrap { position: relative; margin: 18px 0 0; }
.drawer-demo-cta { display: flex; align-items: center; justify-content: center; padding: 14px 0; border-radius: 5px; background: #202020; color: #999999; font-size: 15px; font-weight: 500; letter-spacing: 0.03em; cursor: default; }

.nav-toggle { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.burger { display: none; flex-direction: column; justify-content: center; align-items: flex-end; gap: 6px; width: 44px; height: 44px; cursor: pointer; flex: none; }
.burger span { display: block; width: 20px; height: 1px; background: #eeeeee; transition: transform 260ms ease; }
.drawer { display: none; flex-direction: column; background: #161616; border-top: 1px solid #1d1d1d; padding: 8px 24px 20px; }
.drawer a { display: block; padding: 14px 0; font-size: 15px; letter-spacing: 0.03em; color: #cccccc; border-bottom: 1px solid #232323; }
.drawer a.cta { text-align: center; margin: 16px 0 0; padding: 13px 0; border-radius: 5px; background: #eeeeee; color: #161616; border-bottom: none; }
.nav-toggle:checked ~ .header-inner .burger span:nth-child(1) { transform: translateY(3.5px) rotate(45deg); }
.nav-toggle:checked ~ .header-inner .burger span:nth-child(2) { transform: translateY(-3.5px) rotate(-45deg); }
.nav-toggle:checked ~ .drawer { display: flex; }

@media (max-width: 999px) {
  nav.main-nav { display: none; }
  .burger { display: flex; }
}
@media (max-width: 699px) {
  .header-inner { height: 54px; padding: 0 24px; }
  .header-inner img { height: 34px; }
}

/* ★ 2026-10-06：フッターの寸法・文字の太さを LP 本体（index.html の footerWrap / footerGrid / footerBottom、body の font-weight: 700）に揃えた。
   LP 本体の切り替え：999px 以下＝compact（左右 40px・2列）、699px 以下＝mobile（左右 24px・1列・上下 44/36px）。 */
header.site, footer.site { font-weight: 700; }
header.site a, footer.site a, footer.site p, footer.site div { font-weight: 700; }
footer.site { border-top: 1px solid #232323; background: #161616; }
.footer-grid { width: 880px; max-width: 100%; margin: 0 auto; padding: 60px 0 48px; box-sizing: border-box; display: grid; grid-template-columns: 1.6fr 1fr 1fr; column-gap: 40px; row-gap: 34px; }
.footer-grid img { display: block; height: 44px; width: auto; }
.footer-tagline { margin: 16px 0 0; font-size: 13px; line-height: 1.95; letter-spacing: 0.02em; color: #a6a6a6; }
.footer-head { font-size: 12px; letter-spacing: 0.16em; color: #a1a1a1; }
.footer-link-col { margin-top: 18px; display: flex; flex-direction: column; gap: 13px; }
.footer-link-col a { font-size: 14px; letter-spacing: 0.02em; color: #cccccc; width: fit-content; }
.footer-bottom-wrap { border-top: 1px solid #232323; }
.footer-bottom { width: 880px; max-width: 100%; margin: 0 auto; padding: 18px 0; box-sizing: border-box; font-size: 12px; letter-spacing: 0.03em; color: #a1a1a1; }
@media (max-width: 999px) {
  .footer-grid { width: 100%; padding: 60px 40px 48px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .footer-bottom { width: 100%; padding: 18px 40px; }
}
@media (max-width: 699px) {
  .footer-grid { padding: 44px 24px 36px; grid-template-columns: minmax(0, 1fr); }
  .footer-bottom { padding: 18px 24px; }
  .footer-grid img { height: 34px; }
}

.footer-grid img { filter: invert(1); }

nav.main-nav a.docs { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid #eeeeee; border-radius: 5px; color: #eeeeee; font-weight: 500; }
nav.main-nav a.docs:hover { background: #202020; }
.drawer a.docs { display: flex; align-items: center; justify-content: center; gap: 8px; margin: 6px 0 0; padding: 13px 0; border: 1px solid #eeeeee; border-radius: 5px; color: #eeeeee; }
