/* ==========================================================================
   ポジティブワン株式会社 — SOM商社カタログ
   Design language: "instrument panel" — a technical spec-sheet aesthetic for
   silicon distribution. Dark graphite chassis, per-SoC accent LEDs, monospace
   data type, hairline grid rules. Deliberately NOT the cream/serif default.
   ========================================================================== */
:root{
  --bg:#0d1117;           /* graphite chassis */
  --panel:#161b22;        /* raised panel */
  --panel-2:#1c2430;      /* inset panel */
  --line:#2a323d;         /* hairline */
  --line-bright:#3a4553;
  --ink:#f5f7fa;          /* primary text (brighter) */
  --ink-dim:#c5ced8;      /* secondary (brighter) */
  --ink-faint:#9fabb8;    /* tertiary / labels (brighter, no near-black) */
  --accent:#4dd0c4;       /* default accent, overridden per SoC */
  --warn:#f0883e;
  --radius:4px;
  --mono:"IBM Plex Mono","JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --sans:"NVIDIA Sans","Helvetica Neue",Helvetica,Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--sans);
  font-size:18px;line-height:1.7;
  -webkit-font-smoothing:antialiased;
  letter-spacing:.005em;
}
a{color:inherit;text-decoration:none}
::selection{background:var(--accent);color:#0d1117}

/* --- structural background: faint engineering grid --- */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background-image:
    linear-gradient(var(--line) 1px,transparent 1px),
    linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:44px 44px;
  opacity:.14;
  mask-image:radial-gradient(ellipse 120% 80% at 50% 0%,#000 40%,transparent 90%);
}
.wrap{max-width:1220px;margin:0 auto;padding:0 24px;position:relative;z-index:1}

/* --- top masthead --- */
.masthead{
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(22,27,34,.9),rgba(13,17,23,.4));
  backdrop-filter:blur(8px);
  position:sticky;top:0;z-index:50;
}
.masthead .wrap{display:flex;align-items:center;gap:18px;height:68px}
.brand{display:flex;align-items:baseline;gap:12px;white-space:nowrap}
.brand .mark{
  font-family:var(--mono);font-weight:700;font-size:19px;letter-spacing:.14em;
  color:var(--ink);
}
.brand .mark b{color:var(--accent)}
.brand .sub{font-size:12px;color:var(--ink-faint);letter-spacing:.18em;text-transform:uppercase}
.mast-nav{margin-left:auto;display:flex;gap:2px;font-family:var(--mono);font-size:13.5px}
.mast-nav a{padding:8px 14px;color:var(--ink-dim);border:1px solid transparent;border-radius:var(--radius);letter-spacing:.06em}
.mast-nav a:hover{color:var(--ink);border-color:var(--line-bright);background:var(--panel-2)}

/* --- eyebrow / label typography --- */
.eyebrow{font-family:var(--mono);font-size:12.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint)}
.led{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 8px var(--accent);vertical-align:middle}

/* --- buttons --- */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--mono);font-size:14px;letter-spacing:.06em;
  padding:10px 18px;border-radius:var(--radius);
  border:1px solid var(--line-bright);color:var(--ink);
  background:var(--panel-2);transition:.16s;cursor:pointer;
}
.btn:hover{border-color:var(--accent);color:var(--accent)}
.btn.solid{background:var(--accent);color:#0d1117;border-color:var(--accent);font-weight:600}
.btn.solid:hover{filter:brightness(1.1);color:#0d1117}

footer{border-top:1px solid var(--line);margin-top:80px;padding:40px 0;color:var(--ink-faint);font-size:13.5px}
footer .wrap{display:flex;flex-wrap:wrap;gap:8px 32px;align-items:center;justify-content:space-between}
footer .mono{font-family:var(--mono);letter-spacing:.05em}

/* --- reduced motion --- */
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}