/* ==========================================================================
   Legal / Company pages — shared stylesheet
   ========================================================================== */
:root{
  --ink:#0B1530; --ink-2:#1a2544; --muted:#5a6681;
  --line:#e3e8f2; --line-2:#eef2f9;
  --bg:#ffffff; --bg-soft:#f5f8ff; --bg-tint:#eef3ff;
  --brand:#0B2B7A; --brand-dark:#061d5e; --brand-light:#3d5fc7; --brand-tint:#E3E9FB;
  --accent:#F5A623; --accent-dark:#d98c10;
  --r-sm:8px; --r-md:12px; --r-lg:18px; --r-xl:28px;
  --shadow-sm: 0 1px 2px rgba(11,21,48,.04), 0 2px 8px rgba(11,21,48,.04);
  --shadow-md: 0 6px 18px rgba(11,21,48,.08), 0 2px 6px rgba(11,21,48,.04);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  color:var(--ink); background:var(--bg);
  -webkit-font-smoothing:antialiased; line-height:1.85; letter-spacing:.01em;
}
.num,.en{font-family:"Inter",sans-serif; letter-spacing:-.01em; font-feature-settings:"tnum" 1;}
a{color:var(--brand); text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:960px; margin:0 auto; padding:0 24px}

/* ---------- Topbar ---------- */
.topbar{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.9);
  backdrop-filter: saturate(1.4) blur(12px);
  -webkit-backdrop-filter: saturate(1.4) blur(12px);
  border-bottom:1px solid var(--line-2);
}
.topbar-inner{display:flex; align-items:center; gap:18px; height:64px;}
.topbar .container{max-width:1200px;}
.logo{display:flex; align-items:center; gap:10px; font-weight:900; color:var(--ink)}
.logo-mark{
  width:34px; height:34px; border-radius:8px;
  background:linear-gradient(135deg, var(--brand) 0%, var(--brand-light) 100%);
  display:grid; place-items:center; color:#fff;
  box-shadow:0 4px 10px rgba(11,43,122,.25);
  overflow:hidden; padding:5px;
}
.logo-mark img{width:100%; height:100%; object-fit:contain; filter: brightness(0) invert(1);}
.logo-txt{font-size:16px; line-height:1.1}
.logo-txt small{display:block; font-size:10px; font-weight:500; color:var(--muted); letter-spacing:.15em; margin-top:2px;}
.tb-spacer{flex:1}
.tb-nav{display:flex; gap:22px; font-size:13px; font-weight:600; color:var(--ink-2)}
.tb-nav a{color:inherit}
.tb-nav a:hover{color:var(--brand); text-decoration:none}
.tb-back{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:700; color:var(--muted);
  padding:8px 14px; border-radius:999px; border:1px solid var(--line);
  background:#fff; transition:all .15s;
}
.tb-back:hover{border-color:var(--brand); color:var(--brand); text-decoration:none;}

/* ---------- Page hero ---------- */
.page-hero{
  position:relative; overflow:hidden; padding:72px 0 56px;
  background:
    radial-gradient(900px 400px at 85% 0%, var(--brand-tint) 0%, transparent 60%),
    radial-gradient(600px 300px at 10% 100%, #fff4e0 0%, transparent 60%),
    linear-gradient(180deg, #fff 0%, var(--bg-soft) 100%);
}
.page-hero::before{
  content:""; position:absolute; inset:0;
  background-image:
    linear-gradient(to right, rgba(11,43,122,.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(11,43,122,.04) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(ellipse 80% 60% at 50% 50%, #000 20%, transparent 80%);
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 50%, #000 20%, transparent 80%);
  pointer-events:none;
}
.page-hero .eyebrow{
  display:inline-block; padding:6px 14px; border-radius:999px;
  background:#fff; border:1px solid var(--line);
  font-size:11px; font-weight:700; letter-spacing:.15em;
  color:var(--brand); margin-bottom:16px;
  font-family:"Inter",sans-serif;
}
.page-hero h1{
  font-size: clamp(28px, 3.6vw, 42px); font-weight:900;
  letter-spacing:-.01em; line-height:1.3; margin:0 0 12px;
  position:relative;
}
.page-hero .lead{font-size:14px; color:var(--muted); margin:0; position:relative;}
.page-hero .updated{
  display:inline-flex; align-items:center; gap:6px;
  font-size:12px; color:var(--muted); font-weight:600;
  margin-top:18px; padding:6px 12px; background:#fff;
  border-radius:999px; border:1px solid var(--line);
  position:relative;
}
.page-hero .updated svg{width:12px; height:12px;}

/* ---------- Document body ---------- */
.doc{padding:56px 0 80px;}
.doc-wrap{display:grid; grid-template-columns:220px 1fr; gap:48px;}
.toc{
  position:sticky; top:88px; align-self:start;
  font-size:13px;
}
.toc-label{
  font-size:11px; font-weight:800; color:var(--muted);
  letter-spacing:.15em; margin-bottom:12px;
  padding-bottom:10px; border-bottom:1px solid var(--line);
}
.toc ol{list-style:none; padding:0; margin:0; counter-reset:toc;}
.toc ol li{counter-increment:toc; padding:6px 0;}
.toc ol li::before{
  content:counter(toc, decimal-leading-zero);
  font-family:"Inter",sans-serif; font-weight:700;
  color:var(--muted); margin-right:8px; font-size:11px;
}
.toc a{color:var(--ink-2); font-weight:500;}
.toc a:hover{color:var(--brand); text-decoration:none;}

.doc-body{font-size:15px; color:var(--ink-2);}
.doc-body h2{
  font-size:22px; font-weight:900; color:var(--ink);
  margin:56px 0 18px; padding-top:12px;
  display:flex; align-items:baseline; gap:14px;
  scroll-margin-top:88px;
}
.doc-body h2:first-child{margin-top:0;}
.doc-body h2::before{
  content: attr(data-n);
  font-family:"Inter",sans-serif; font-weight:800;
  color:var(--brand); font-size:14px;
  background:var(--brand-tint);
  padding:4px 10px; border-radius:6px;
  letter-spacing:.05em;
}
.doc-body h3{
  font-size:15px; font-weight:800; color:var(--ink);
  margin:28px 0 10px;
}
.doc-body p{margin:0 0 14px;}
.doc-body ul, .doc-body ol{padding-left:22px; margin:0 0 18px;}
.doc-body li{margin-bottom:6px;}
.doc-body .lead-p{
  font-size:15px; color:var(--ink-2); line-height:1.9;
  padding:18px 22px; background:var(--bg-soft);
  border-left:3px solid var(--brand); border-radius:0 8px 8px 0;
  margin-bottom:28px;
}

/* Company info table */
.company-tbl{
  width:100%; border-collapse:collapse;
  margin:8px 0 28px;
  background:#fff; border:1px solid var(--line);
  border-radius:var(--r-lg); overflow:hidden;
}
.company-tbl th, .company-tbl td{
  padding:16px 20px; text-align:left; vertical-align:top;
  font-size:14px; border-bottom:1px solid var(--line-2);
}
.company-tbl tr:last-child th, .company-tbl tr:last-child td{border-bottom:0;}
.company-tbl th{
  width:180px; background:var(--bg-soft);
  font-weight:700; color:var(--ink-2); font-size:13px;
}
.company-tbl td{color:var(--ink);}
.company-tbl td small{display:block; color:var(--muted); font-size:12px; margin-top:4px; font-weight:500;}

.map-card{
  margin-top:24px; aspect-ratio:16/7; border-radius:var(--r-lg); overflow:hidden;
  border:1px solid var(--line); background:linear-gradient(135deg, #eef3ff, #fff4e0);
  position:relative; display:grid; place-items:center;
}
.map-card .map-ghost{
  text-align:center; color:var(--muted); font-weight:700; font-size:13px;
}
.map-card iframe{width:100%; height:100%; border:0; display:block;}

/* Contact strip */
.contact-strip{
  margin-top:48px; padding:28px 32px;
  background:linear-gradient(135deg, var(--ink) 0%, var(--ink-2) 100%);
  color:#fff; border-radius:var(--r-xl);
  display:grid; grid-template-columns: 1fr auto; gap:22px; align-items:center;
}
.contact-strip h3{margin:0 0 4px; font-size:18px; font-weight:900;}
.contact-strip p{margin:0; font-size:13px; opacity:.75;}
.contact-strip .actions{display:flex; gap:10px; flex-wrap:wrap;}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-weight:700; border-radius:999px; padding:12px 20px;
  font-size:14px; transition:all .15s; white-space:nowrap;
  text-decoration:none;
}
.btn:hover{text-decoration:none; transform:translateY(-1px);}
.btn-primary{background:var(--accent); color:var(--ink); box-shadow:0 6px 14px rgba(245,166,35,.3);}
.btn-primary:hover{background:#ffb733;}
.btn-ghost-dark{background:transparent; color:#fff; border:1px solid rgba(255,255,255,.3);}
.btn-ghost-dark:hover{border-color:#fff; background:rgba(255,255,255,.1);}

/* ---------- Footer ---------- */
footer{background:var(--ink); color:rgba(255,255,255,.7); padding:50px 0 30px;}
footer .container{max-width:1200px;}
.ft-grid{display:grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap:32px; margin-bottom:32px;}
.ft-brand{display:flex; align-items:center; gap:10px; color:#fff; font-weight:900; margin-bottom:12px;}
.ft-desc{font-size:12px; line-height:1.8;}
footer h4{color:#fff; font-size:12px; font-weight:800; margin:0 0 12px; letter-spacing:.08em;}
footer ul{list-style:none; padding:0; margin:0; font-size:12px;}
footer ul li{margin-bottom:8px;}
footer ul a{color:rgba(255,255,255,.65);}
footer ul a:hover{color:#fff; text-decoration:none;}
.ft-company{
  padding:18px 0 22px; border-top:1px solid rgba(255,255,255,.1);
  font-size:12px; color:rgba(255,255,255,.7);
  display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px 28px;
}
.ft-company .lbl{color:rgba(255,255,255,.45); margin-right:10px;}
.ft-bottom{
  padding-top:20px; border-top:1px solid rgba(255,255,255,.1);
  display:flex; justify-content:space-between; font-size:11px; color:rgba(255,255,255,.5);
}

@media (max-width: 900px){
  .doc-wrap{grid-template-columns:1fr; gap:28px;}
  .toc{position:static; order:-1; padding:16px 18px; background:var(--bg-soft); border-radius:12px;}
  .doc-body h2{font-size:19px;}
  .company-tbl th{width:120px; font-size:12px; padding:14px;}
  .company-tbl td{font-size:13px; padding:14px;}
  .contact-strip{grid-template-columns:1fr; padding:22px;}
  .ft-grid{grid-template-columns:1fr 1fr; gap:22px;}
  .ft-bottom{flex-direction:column; gap:8px;}
}