:root {
    --paper: #F4F4F1;
    --ink: #17181B;
    --ink-soft: #4A4B4F;
    --muted: #8C8C86;
    --line: #DEDED8;
    --accent: #2E4756;
    --card: #FBFBF9;
    --maxw: 1080px;
    --gutter: clamp(24px, 6vw, 88px);
    --serif: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "Noto Serif JP", Georgia, "Times New Roman", serif;
    --sans: "Helvetica Neue", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "Meiryo", system-ui, -apple-system, sans-serif;
  }
  @media (prefers-color-scheme: dark) {
    :root {
      --paper: #111214;
      --ink: #ECECE7;
      --ink-soft: #B4B4AE;
      --muted: #7B7B76;
      --line: #2A2B2E;
      --accent: #86A6B4;
      --card: #17181B;
    }
  }
  :root[data-theme="light"] {
    --paper: #F4F4F1; --ink: #17181B; --ink-soft: #4A4B4F; --muted: #8C8C86;
    --line: #DEDED8; --accent: #2E4756; --card: #FBFBF9;
  }
  :root[data-theme="dark"] {
    --paper: #111214; --ink: #ECECE7; --ink-soft: #B4B4AE; --muted: #7B7B76;
    --line: #2A2B2E; --accent: #86A6B4; --card: #17181B;
  }

  * { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100%; }
  body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--sans);
    line-height: 1.7;
    font-feature-settings: "palt" 1;
    -webkit-font-smoothing: antialiased;
  }
  .wrap { max-width: var(--maxw); margin: 0 auto; padding-inline: var(--gutter); }

  .eyebrow {
    font-size: 12px; letter-spacing: .22em; text-transform: uppercase;
    color: var(--muted); font-weight: 600;
  }

  /* ---------- Nav ---------- */
  header {
    position: sticky; top: 0; z-index: 10;
    background: color-mix(in srgb, var(--paper) 86%, transparent);
    backdrop-filter: saturate(1.2) blur(8px);
    border-bottom: 1px solid transparent;
    transition: border-color .3s ease;
  }
  header.scrolled { border-color: var(--line); }
  .nav {
    display: flex; align-items: center; justify-content: space-between;
    height: 72px;
  }
  .brand {
    display: flex; align-items: baseline; gap: 10px;
    font-weight: 700; letter-spacing: .02em; text-decoration: none; color: var(--ink);
  }
  .brand .mark { font-family: var(--serif); font-size: 22px; }
  .brand .name { font-size: 14px; letter-spacing: .18em; }
  .nav ul { list-style: none; display: flex; gap: clamp(18px, 3vw, 40px); margin: 0; padding: 0; }
  .nav a.link {
    text-decoration: none; color: var(--ink-soft); font-size: 13px;
    letter-spacing: .12em; text-transform: uppercase; font-weight: 600;
    padding: 6px 0; position: relative;
  }
  .nav a.link::after {
    content: ""; position: absolute; left: 0; bottom: 0; height: 1px; width: 0;
    background: var(--ink); transition: width .28s ease;
  }
  .nav a.link:hover::after, .nav a.link:focus-visible::after { width: 100%; }

  /* ---------- Hero ---------- */
  .hero { padding-top: clamp(64px, 14vh, 150px); padding-bottom: clamp(72px, 16vh, 170px); }
  .hero .eyebrow { margin-bottom: clamp(24px, 5vh, 44px); }
  .hero h1 {
    font-family: var(--serif); font-weight: 600;
    font-size: clamp(38px, 8.5vw, 92px);
    line-height: 1.12; letter-spacing: .01em; margin: 0;
    text-wrap: balance;
  }
  .hero h1 .thin { color: var(--ink-soft); font-weight: 400; }
  .hero p.lede {
    margin: clamp(28px, 5vh, 46px) 0 0;
    max-width: 30em; font-size: clamp(15px, 1.5vw, 18px); color: var(--ink-soft);
  }

  /* ---------- Statement ---------- */
  .statement { padding-block: clamp(72px, 14vh, 150px); border-top: 1px solid var(--line); }
  .statement .grid { display: grid; grid-template-columns: 1fr; gap: clamp(40px, 6vh, 68px); }
  .stmt {
    display: grid; grid-template-columns: 120px 1fr; gap: clamp(16px, 4vw, 48px);
    align-items: start;
  }
  .stmt .k { font-size: 12px; letter-spacing: .2em; text-transform: uppercase; color: var(--muted); font-weight: 600; padding-top: .5em; }
  .stmt .v {
    font-family: var(--serif); font-weight: 500;
    font-size: clamp(21px, 3vw, 33px); line-height: 1.55; margin: 0; letter-spacing: .01em;
    text-wrap: pretty;
  }
  @media (max-width: 640px) { .stmt { grid-template-columns: 1fr; gap: 10px; } }

  /* ---------- Team ---------- */
  .team { padding-block: clamp(64px, 12vh, 130px); border-top: 1px solid var(--line); }
  .sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin-bottom: clamp(36px, 6vh, 60px); }
  .sec-head h2 { font-family: var(--serif); font-weight: 600; font-size: clamp(26px, 4vw, 40px); margin: 0; letter-spacing: .02em; }
  .sec-head a.more { font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); text-decoration: none; font-weight: 600; white-space: nowrap; }
  .sec-head a.more:hover { text-decoration: underline; text-underline-offset: 4px; }
  .members { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: clamp(40px, 6vw, 80px); row-gap: clamp(40px, 6vh, 60px); }
  .members.two { grid-template-columns: repeat(2, 1fr); }
  @media (max-width: 720px) { .members, .members.two { grid-template-columns: 1fr; } }
  .member { background: transparent; padding: 0; display: flex; flex-direction: column; gap: 6px; }
  .member .portrait {
    width: 100%; max-width: 320px; aspect-ratio: 4 / 5; margin-bottom: 22px;
    overflow: hidden; background: color-mix(in srgb, var(--accent) 12%, var(--paper));
    display: flex; align-items: center; justify-content: center;
  }
  .member .portrait img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; display: block; }
  .member .portrait .ph { font-size: 11px; letter-spacing: .14em; color: var(--muted); font-weight: 600; text-transform: uppercase; }
  .member .role { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
  .member .pname { font-family: var(--serif); font-size: 20px; font-weight: 600; }
  .member .pname .en { display: block; font-family: var(--sans); font-size: 12px; letter-spacing: .12em; color: var(--muted); font-weight: 500; margin-top: 2px; }
  .member .bio { font-size: 13.5px; color: var(--ink-soft); margin-top: 14px; max-width: 30em; }

  /* ---------- Company / Footer ---------- */
  footer { border-top: 1px solid var(--line); padding-block: clamp(56px, 10vh, 100px) clamp(36px, 6vh, 56px); }
  .foot-grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(40px, 6vw, 80px); }
  @media (max-width: 720px) { .foot-grid { grid-template-columns: 1fr; gap: 44px; } }
  .foot-brand .mark { font-family: var(--serif); font-size: 40px; line-height: 1; }
  .foot-brand p { color: var(--ink-soft); max-width: 26em; margin: 20px 0 0; font-size: 14px; }
  dl.facts { margin: 0; display: grid; grid-template-columns: 108px 1fr; row-gap: 14px; column-gap: 20px; font-size: 14px; }
  dl.facts dt { color: var(--muted); font-size: 12px; letter-spacing: .1em; padding-top: 2px; }
  dl.facts dd { margin: 0; color: var(--ink); font-variant-numeric: tabular-nums; }
  dl.facts dd a { color: var(--accent); text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--accent) 40%, transparent); }
  dl.facts dd a:hover { border-bottom-color: var(--accent); }
  .legal { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 14px; margin-top: clamp(44px, 8vh, 76px); padding-top: 22px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; letter-spacing: .04em; }
  .legal a { color: var(--muted); text-decoration: none; }
  .legal a:hover { color: var(--ink); }

  a:focus-visible, button:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 2px; }

  /* ---------- load-in ---------- */
  .reveal { opacity: 0; transform: translateY(14px); animation: rise .9s cubic-bezier(.2,.7,.2,1) forwards; }
  .reveal.d1 { animation-delay: .05s; } .reveal.d2 { animation-delay: .16s; } .reveal.d3 { animation-delay: .28s; }
  @keyframes rise { to { opacity: 1; transform: none; } }
  @media (prefers-reduced-motion: reduce) { .reveal { animation: none; opacity: 1; transform: none; } }

  .note { max-width: var(--maxw); margin: 0 auto; padding: 10px var(--gutter); font-size: 11.5px; color: var(--muted); letter-spacing: .04em; }
