/* POSITIVE ONE GROUP — shared base (subpages) */
:root{
  --void:#050708;--void2:#090c0e;--panel:#0d1114;
  --hair:#1c2226;--hair-hi:#2c353b;
  --w:#f4f6f5;--dim:#7d8a8c;
  --amber:#ffae00;--amber-dim:rgba(255,174,0,.14);
  --jp:"Noto Sans JP","Noto Sans",sans-serif;
  --en:"Space Grotesk",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
[id]{scroll-margin-top:88px}
.skip{position:fixed;left:-9999px;top:12px;z-index:500;background:var(--amber);color:var(--void);padding:11px 20px;font-weight:700;font-size:13px}
.skip:focus{left:12px}
body{font-family:var(--jp);background:var(--void);color:var(--w);font-size:15px;line-height:1.9;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
svg,img{display:block}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px}
:focus-visible{outline:1.5px solid var(--amber);outline-offset:4px}
::selection{background:var(--amber);color:var(--void)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

/* progress bar */
#pbar{position:fixed;top:0;left:0;height:2px;width:0;z-index:300;background:var(--amber);box-shadow:0 0 10px rgba(255,174,0,.7)}

/* header */
header{position:fixed;top:0;left:0;right:0;z-index:100;background:rgba(5,7,8,.6);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.07)}
.hd{display:flex;align-items:center;justify-content:space-between;height:62px}
.logo{display:inline-flex;align-items:center;transition:filter .25s}
.logo:hover{filter:brightness(1.2)}
.logo img{height:26px;width:auto;display:block}
nav.gnav{display:flex;gap:30px}
nav.gnav a{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:#aeb9b8;transition:color .25s;white-space:nowrap}
nav.gnav a:hover,nav.gnav a.cur{color:var(--amber)}
.hd-cta{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--void);background:var(--w);padding:9px 20px;transition:.25s;font-weight:500}
.hd-cta:hover{background:var(--amber)}
.menu-btn{display:none;background:none;border:1px solid var(--hair-hi);padding:8px 12px;font-family:var(--mono);font-size:10px;color:var(--w);cursor:pointer;letter-spacing:.2em}

/* page hero */
.phero{padding:170px 0 70px;border-bottom:1px solid var(--hair);position:relative;overflow:hidden}
.phero::after{content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(255,174,0,.08),transparent 65%);pointer-events:none}
.phero .kicker{font-family:var(--mono);font-size:11px;letter-spacing:.42em;color:var(--amber);display:flex;align-items:center;gap:14px}
.phero .kicker::before{content:"";width:34px;height:1px;background:var(--amber)}
.phero h1{font-weight:900;font-size:clamp(38px,6vw,72px);line-height:1.25;margin-top:24px}
.phero .lead{margin-top:20px;max-width:640px;color:#b9c4c2;font-size:15px}
.phero .crumb{font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--dim);margin-top:34px}
.phero .crumb a:hover{color:var(--amber)}

/* section shell */
section{padding:100px 0}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:56px;flex-wrap:wrap}
.sec-head .eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.42em;color:var(--amber)}
.sec-head h2{font-weight:900;font-size:clamp(30px,4.2vw,50px);line-height:1.35;margin-top:14px}
.sec-head .idx{font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--dim)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:12px;font-family:var(--mono);font-size:12px;letter-spacing:.22em;padding:17px 36px;transition:.3s;border:none;cursor:pointer}
.btn-fill{background:var(--w);color:var(--void);font-weight:500}
.btn-fill:hover{background:var(--amber)}
.btn-frame{border:1px solid var(--hair-hi);color:var(--w);background:transparent}
.btn-frame:hover{border-color:var(--amber);color:var(--amber)}

/* generic cards / tables */
.grid1px{display:grid;gap:1px;background:var(--hair);border:1px solid var(--hair)}
.cell{background:var(--void);padding:34px 32px}
.cell h3{font-weight:900;font-size:19px}
.cell .ce{font-family:var(--mono);font-size:9.5px;letter-spacing:.28em;color:var(--amber);margin-top:4px}
.cell p{font-size:13px;color:#93a09e;margin-top:12px}
.cell .no{font-family:var(--en);font-weight:700;font-size:13px;color:var(--dim)}

table.spec{width:100%;border-collapse:collapse;font-size:14px}
table.spec th{text-align:left;font-family:var(--mono);font-size:11px;letter-spacing:.2em;color:var(--dim);font-weight:400;padding:18px 24px 18px 0;border-bottom:1px solid var(--hair);white-space:nowrap;vertical-align:top;width:11em}
table.spec td{padding:18px 0;border-bottom:1px solid var(--hair);color:#c9d2d0}

/* footer */
footer{border-top:1px solid var(--hair);padding:64px 0 36px;background:var(--void2)}
.ftg{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:44px}
.ftg .desc{font-size:12.5px;color:var(--dim);margin-top:18px;max-width:300px}
.ftg h4{font-family:var(--mono);font-size:10px;letter-spacing:.34em;color:var(--dim);margin-bottom:20px;font-weight:400}
.ftg ul{list-style:none}
.ftg ul li{margin-bottom:11px}
.ftg ul a{font-size:13px;color:#b9c4c2;transition:color .2s}
.ftg ul a:hover{color:var(--amber)}
.ft-btm a:hover{color:var(--amber)}
.ft-btm{margin-top:60px;padding-top:24px;border-top:1px solid var(--hair);display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:#4a5559}

/* reveal */
.rv{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
.rv.on{opacity:1;transform:none}

/* responsive */
@media(max-width:1020px){.ftg{grid-template-columns:1fr 1fr}}
@media(max-width:1120px){
  nav.gnav{gap:18px}
  nav.gnav a{font-size:10px;letter-spacing:.12em}
}
@media(max-width:900px){
  nav.gnav{display:none}
  nav.gnav.open{display:flex;flex-direction:column;gap:22px;position:absolute;top:62px;left:0;right:0;background:var(--void);border-bottom:1px solid var(--hair);padding:28px 32px}
  nav.gnav.open a{font-size:12px;letter-spacing:.2em}
  .menu-btn{display:block}
  .hd-cta{display:none}
}
@media(max-width:720px){
  section{padding:70px 0}
  .phero{padding:130px 0 56px}
  .ftg{grid-template-columns:1fr}
}

/* ===== 右下：上下セクション誘導 ===== */
.vnav{position:fixed;right:26px;bottom:26px;z-index:96;display:flex;flex-direction:column;gap:7px}
.vnav button{
  width:46px;height:46px;border:1px solid var(--hair-hi);
  background:rgba(5,7,8,.62);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  color:var(--w);font-family:var(--en);font-size:17px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:.25s;
}
.vnav button:hover{background:var(--amber);border-color:var(--amber);color:var(--void)}
.vnav button:disabled{opacity:.22;pointer-events:none}
.vnav .vlbl{
  font-family:var(--mono);font-size:9px;letter-spacing:.14em;color:var(--amber);
  text-align:center;padding:1px 0;font-variant-numeric:tabular-nums;
}
@media(max-width:720px){
  .vnav{right:14px;bottom:14px}
  .vnav button{width:42px;height:42px;font-size:15px}
}

/* RTL adjustments */
[dir="rtl"] table.spec th{text-align:right;padding:18px 0 18px 24px}
[dir="rtl"] .phero .kicker::before{order:2}
/* narrow phones: spec table */
@media(max-width:560px){
  table.spec th{width:6.5em;font-size:10px;padding-right:14px}
  table.spec{font-size:13px}
}

.ft-langs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:52px;padding-top:22px;border-top:1px solid var(--hair)}
.ft-langs .fl-lb{font-family:var(--mono);font-size:9px;letter-spacing:.3em;color:var(--dim);margin-right:10px}
.ft-langs a{font-family:var(--mono);font-size:10px;letter-spacing:.1em;color:#aeb9b8;border:1px solid var(--hair-hi);padding:5px 12px;transition:.25s}
.ft-langs a:hover{border-color:var(--amber);color:var(--amber)}
.ft-langs a.on{background:var(--amber);border-color:var(--amber);color:var(--void)}

/* ===== ヘッダー言語切替（HUDパネル） ===== */
.hd-r{display:flex;align-items:center;gap:14px}
.lsw{position:relative}
.lsw-btn{
  display:inline-flex;align-items:center;gap:9px;height:36px;padding:0 13px;
  background:transparent;border:1px solid var(--hair-hi);color:#c9d2d0;
  font-family:var(--mono);font-size:11px;letter-spacing:.18em;cursor:pointer;transition:.25s;
}
.lsw-btn .ld{width:6px;height:6px;border-radius:50%;background:var(--amber);box-shadow:0 0 8px var(--amber)}
.lsw-btn .car{font-size:8px;transition:transform .25s;color:var(--dim)}
.lsw-btn:hover,.lsw.open .lsw-btn{border-color:var(--amber);color:var(--amber)}
.lsw.open .lsw-btn .car{transform:rotate(180deg)}
.lsw-panel{
  position:absolute;top:calc(100% + 13px);right:0;width:min(600px,94vw);
  background:rgba(7,10,12,.94);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border:1px solid var(--hair-hi);padding:18px;z-index:130;
  opacity:0;transform:translateY(-10px);pointer-events:none;visibility:hidden;
  transition:opacity .28s cubic-bezier(.16,1,.3,1),transform .28s cubic-bezier(.16,1,.3,1),visibility .28s;
}
.lsw-panel::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--amber),transparent 65%)}
.lsw.open .lsw-panel{opacity:1;transform:none;pointer-events:auto;visibility:visible}
.lsw-hd{font-family:var(--mono);font-size:9px;letter-spacing:.32em;color:var(--dim);margin-bottom:13px;display:flex;align-items:center;gap:10px}
.lsw-hd::after{content:"";flex:1;height:1px;background:var(--hair)}
.lsw-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hair);border:1px solid var(--hair)}
.lsw-grid a{background:var(--void);padding:11px 13px;display:flex;justify-content:space-between;align-items:center;gap:8px;transition:.2s}
.lsw-grid a b{font-size:12.5px;font-weight:500;color:#c9d2d0;white-space:nowrap}
.lsw-grid a i{font-family:var(--mono);font-style:normal;font-size:8.5px;letter-spacing:.12em;color:var(--dim)}
.lsw-grid a:hover{background:var(--panel)}
.lsw-grid a:hover b{color:var(--amber)}
.lsw-grid a.on{background:var(--amber-dim);box-shadow:inset 2px 0 0 var(--amber)}
.lsw-grid a.on b{color:var(--amber)}
@keyframes lspulse{0%,100%{opacity:1}50%{opacity:.3}}
/* 地域検知サジェスト */
.lang-suggest{
  position:fixed;top:76px;left:50%;transform:translate(-50%,-14px);z-index:150;
  display:flex;align-items:center;gap:13px;max-width:94vw;
  background:rgba(7,10,12,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border:1px solid var(--hair-hi);border-left:2px solid var(--amber);padding:11px 15px;
  font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:#c9d2d0;
  opacity:0;transition:.45s cubic-bezier(.16,1,.3,1);
}
.lang-suggest.show{opacity:1;transform:translate(-50%,0)}
.lang-suggest::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--amber);animation:lspulse 1.6s infinite;flex-shrink:0}
.lang-suggest a{color:var(--amber);white-space:nowrap;font-weight:600}
.lang-suggest .lx{background:none;border:none;color:var(--dim);cursor:pointer;font-size:13px;padding:0 2px}
.lang-suggest .lx:hover{color:var(--w)}
@media(max-width:720px){
  .lsw-btn{padding:0 10px;letter-spacing:.1em}
  .lsw-panel{position:fixed;top:62px;left:0;right:0;width:auto;border-left:none;border-right:none}
  .lsw-grid{grid-template-columns:1fr 1fr}
}

[dir="rtl"] .lsw-panel{right:auto;left:0}
[dir="rtl"] .crumb{direction:ltr;display:inline-block}
