:root{
    --ink:#111e2a; --ink-soft:#4d6274; --ink-faint:#7f92a3;
    --paper:#f7f5f2; --card:#ffffff; --line:#e4e0d9;
    --navy:#123a5c; --navy-deep:#0c2438; --cyan:#0d7fa6; --cyan-lift:#7fd4ea;
    --onnavy:#dfeaf2; --sand:#efe9e0;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --ink:#e9eff4; --ink-soft:#a8bac9; --ink-faint:#73899b;
      --paper:#0b1219; --card:#121d27; --line:#233240;
      --navy:#9fcbe6; --navy-deep:#081420; --cyan:#67c4e2; --cyan-lift:#a9e3f5;
      --onnavy:#dceaf4; --sand:#16222d;
    }
  }
  :root[data-theme="dark"]{
    --ink:#e9eff4; --ink-soft:#a8bac9; --ink-faint:#73899b;
    --paper:#0b1219; --card:#121d27; --line:#233240;
    --navy:#9fcbe6; --navy-deep:#081420; --cyan:#67c4e2; --cyan-lift:#a9e3f5;
    --onnavy:#dceaf4; --sand:#16222d;
  }
  *{box-sizing:border-box}
  html{-webkit-text-size-adjust:100%}
  body{
    margin:0; background:var(--paper); color:var(--ink);
    font:400 17px/1.68 Karla,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
    -webkit-font-smoothing:antialiased;
  }
  .wrap{width:100%;max-width:640px;margin:0 auto;padding:0 26px}
  a{color:var(--cyan)}
  a:focus-visible,.btn:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:2px}

  /* ── hero: the nearness field, the mark's idea as atmosphere ── */
  .hero{
    position:relative; overflow:hidden; background:var(--navy-deep); color:var(--onnavy);
    padding:62px 0 58px;
  }
  .field{position:absolute;inset:-18% -10%;pointer-events:none;opacity:.07}
  .field ellipse{fill:#5fb4d8;stroke:none}
  .field path{stroke:#5fb4d8;stroke-width:0.9;stroke-linecap:round}
  /* the mark — frozen 2026-08-29, see marketing/brand/BRAND-MARK.md */
  .mark{width:60px;height:60px;display:block;color:var(--cyan-lift);margin:0 0 22px}
  .hero .wrap{position:relative}
  .lockup{
    display:flex; align-items:center; flex-wrap:wrap; gap:.06em .28em;
    font:400 clamp(2.1rem,7.4vw,3.5rem)/1.05 "Instrument Serif",Georgia,"Times New Roman",serif;
    letter-spacing:-.015em; margin:0 0 .5em; color:#fff;
  }
  .lockup .near{color:var(--cyan-lift);font-style:italic}
  .joint{
    width:.92em; height:.92em; flex:none; color:var(--cyan-lift);
    transform:translateY(.04em);
  }
  .promise{
    font:400 clamp(1.05rem,2.6vw,1.3rem)/1.5 Karla,sans-serif;
    color:var(--onnavy); max-width:30em; margin:0 0 1.9em;
  }
  .promise strong{color:#fff;font-weight:600}
  .scale{
    font:400 clamp(1rem,2.3vw,1.18rem)/1.5 Karla,sans-serif;
    color:var(--onnavy); max-width:30em; margin:1.4em 0 0;
  }
  .scale strong{color:#fff;font-weight:600}
  .vision{
    font:500 .68rem/1.6 Karla,sans-serif; letter-spacing:.19em; text-transform:uppercase;
    color:#7fa9c6; margin:1.9em 0 0;
  }
  /* the exchange, now in the hero and on dark */
  .hero .talk{background:rgba(255,255,255,.055);border-color:rgba(255,255,255,.14);box-shadow:none}
  .hero .turn{border-bottom-color:rgba(255,255,255,.13)}
  .hero .who{color:#8fb4cf}
  .hero .them .who{color:var(--cyan-lift)}
  .hero .you .said{color:#fff}
  .hero .them .said{color:var(--onnavy)}
  .hero .done{border-top-color:rgba(255,255,255,.2);color:var(--cyan-lift)}

  /* ── rhythm ── */
  section{padding:56px 0}
  section + section{border-top:1px solid var(--line)}
  .eyebrow{
    font:600 .7rem/1.5 Karla,sans-serif; letter-spacing:.17em; text-transform:uppercase;
    color:var(--cyan); margin:0 0 1.1em;
  }
  h2{
    font:400 clamp(1.75rem,4.6vw,2.5rem)/1.14 "Instrument Serif",Georgia,serif;
    letter-spacing:-.008em; margin:0 0 .55em; color:var(--ink); text-wrap:balance;
  }
  p{margin:0 0 1.15em;max-width:34em}
  .lead{font-size:1.16rem;line-height:1.55;color:var(--ink-soft)}
  .quiet{color:var(--ink-faint);font-size:.97rem}
  strong{font-weight:700}

  /* ── the exchange: the page's best asset, treated like one ── */
  .talk{
    background:var(--card); border:1px solid var(--line); border-radius:4px;
    padding:8px 22px 20px; margin:0 0 1.5em;
    box-shadow:0 1px 2px rgba(17,30,42,.04), 0 8px 24px -12px rgba(17,30,42,.14);
  }
  .turn{padding:18px 0;border-bottom:1px solid var(--line)}
  .turn:last-of-type{border-bottom:0}
  .who{
    display:block; font:600 .66rem/1.5 Karla,sans-serif; letter-spacing:.15em;
    text-transform:uppercase; color:var(--ink-faint); margin:0 0 6px;
  }
  .said{margin:0;font-size:1.06rem;max-width:none}
  .you .said{font-weight:600;color:var(--ink)}
  .them .who{color:var(--cyan)}
  .them .said{color:var(--ink-soft)}
  .done{
    margin:0; padding:16px 0 0; border-top:1px dashed var(--line);
    font:600 .78rem/1.5 Karla,sans-serif; letter-spacing:.13em; text-transform:uppercase;
    color:var(--cyan); max-width:none;
  }

  /* ── business band ── */
  .band{background:var(--navy-deep);color:var(--onnavy);border-top:0}
  .band .wrap{padding-top:64px;padding-bottom:64px}
  .band .eyebrow{color:#8fc3dd}
  .band h2{color:#fff}
  .band p{color:var(--onnavy)}
  .band ul{margin:0 0 1.3em;padding:0;list-style:none;max-width:34em}
  .band li{
    padding:11px 0 11px 26px; position:relative;
    border-bottom:1px solid rgba(255,255,255,.11);
  }
  .band li:last-child{border-bottom:0}
  .band li::before{
    content:""; position:absolute; left:2px; top:1.32em;
    width:9px; height:9px; border:1.5px solid var(--cyan-lift); border-radius:50%;
  }

  /* ── cta ── */
  .cta{display:flex;flex-wrap:wrap;gap:12px;margin:1.6em 0 0}
  .btn{
    display:inline-block;text-decoration:none;
    font:600 .93rem/1 Karla,sans-serif;letter-spacing:.02em;
    padding:14px 22px;border-radius:3px;transition:opacity .18s,background .18s;
  }
  .btn-primary{background:var(--navy);color:var(--paper)}
  .band .btn-primary{background:#fff;color:var(--navy-deep)}
  .btn:hover{opacity:.86}

  footer{background:var(--sand);border-top:1px solid var(--line)}
  footer .wrap{padding-top:40px;padding-bottom:52px}
  footer p{margin:.42em 0;max-width:none;font-size:.88rem;color:var(--ink-soft)}
  footer .name{font:600 .95rem/1.5 Karla,sans-serif;color:var(--ink);margin:0 0 1.1em}
  footer .lbl{font:600 .62rem/1.5 Karla,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 .55em}
  footer .offices{display:grid;gap:26px 44px;margin:.2em 0 0}
  @media(min-width:560px){footer .offices{grid-template-columns:1fr 1fr}}
  footer .city{font:600 .95rem/1.5 Karla,sans-serif;color:var(--ink);margin:0 0 .35em}
  footer .offices p{margin:0 0 .45em;line-height:1.62}
  footer .offices a{color:var(--ink-soft);text-decoration:none}
  footer .offices a:hover{color:var(--cyan)}
  footer .mailto{margin-top:1.7em}
  footer .langs{display:flex;flex-wrap:wrap;gap:.3em 1.35em;margin:.2em 0 0}
  footer .langs a{font-size:.88rem;line-height:1.62;color:var(--ink-soft);text-decoration:none}
  footer .langs a:hover{color:var(--cyan)}

  @media (prefers-reduced-motion:reduce){*{transition:none!important}}

  /* ── site nav ── */
  .nav{background:var(--navy-deep);border-bottom:1px solid rgba(255,255,255,.10)}
  .nav .wrap{display:flex;align-items:center;gap:22px;padding-top:15px;padding-bottom:15px;flex-wrap:wrap}
  .nav .home{display:flex;align-items:center;gap:.4em;text-decoration:none;color:#fff;
    font:400 1.12rem/1 "Instrument Serif",Georgia,serif;margin-right:auto}
  .nav .home svg{width:1.5em;height:1.5em;color:var(--cyan-lift)}
  .nav a.link{font:600 .78rem/1 Karla,sans-serif;letter-spacing:.09em;text-transform:uppercase;
    color:#a8c8dd;text-decoration:none}
  .nav a.link:hover,.nav a.link[aria-current]{color:#fff}
  .nav a.lang{margin-left:auto;color:var(--cyan-lift)}
  .nav a.lang:hover{color:#fff}
  .pagehead{background:var(--navy-deep);color:var(--onnavy);padding:56px 0 52px}
  .pagehead h1{font:400 clamp(2rem,5.4vw,2.9rem)/1.1 "Instrument Serif",Georgia,serif;
    color:#fff;margin:0 0 .3em;text-wrap:balance}
  .pagehead p{color:var(--onnavy);font-size:1.1rem;max-width:34em;margin:0}
  .grid2{display:grid;gap:30px}
  @media(min-width:640px){.grid2{grid-template-columns:1fr 1fr;gap:34px 40px}}
  .grid2 h3{font:600 .96rem/1.4 Karla,sans-serif;color:var(--ink);margin:0 0 .4em}
  .grid2 p{margin:0;color:var(--ink-soft);font-size:.98rem}