/* Layout: an ink plate masthead over a hairline-ruled registry sheet — deep sapphire reserved for rules, seals and figures, with air doing the work of ornament. */
:root{
  --bg:#F8F9FB; --surface:#FFFFFF; --ink:#0A1220; --muted:#5C6779;
  --accent:#1A3F8F; --accent-bright:#3E72D6; --tint:#F0F4FB;
  --rule:#E1E7F0; --rule-soft:#EDF1F7;
  /* the masthead plate stays ink in both themes */
  --plate:#080E18; --plate-ink:#F2F5FA; --plate-muted:#93A3BC;
  --plate-rule:#1C2838; --plate-accent:#7FABFF;
  --font-display:"Bodoni Moda",Didot,"Bodoni MT",Georgia,serif;
  --font-body:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --measure:62ch; --maxw:1140px;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#070B12; --surface:#0E151F; --ink:#EEF2F8; --muted:#94A2B6;
    --accent:#7FABFF; --accent-bright:#A6C6FF; --tint:#101A28;
    --rule:#1B2534; --rule-soft:#151E2B;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#070B12; --surface:#0E151F; --ink:#EEF2F8; --muted:#94A2B6;
  --accent:#7FABFF; --accent-bright:#A6C6FF; --tint:#101A28;
  --rule:#1B2534; --rule-soft:#151E2B;
  color-scheme:dark;
}

*{box-sizing:border-box}
body{
  background:var(--bg); color:var(--ink);
  font-family:var(--font-body); font-size:16px; line-height:1.62;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
a{color:inherit}
h1,h2,h3{margin:0; text-wrap:balance}
p{margin:0}
.wrap{max-width:var(--maxw); margin-inline:auto; padding-inline:22px}

/* ---------- seal + wordmark ---------- */
.brand{display:flex; align-items:center; gap:12px; text-decoration:none}
.seal{
  width:32px; height:32px; flex:none; position:relative;
  border:1px solid currentColor; border-radius:50%;
  display:grid; place-items:center;
  font-family:var(--font-display); font-size:15px; line-height:1; padding-bottom:1px;
}
.seal::after{
  content:""; position:absolute; inset:3px; border:1px solid currentColor;
  border-radius:50%; opacity:.34;
}
.wordmark{
  font-family:var(--font-display); font-weight:500;
  font-size:19px; letter-spacing:.14em; text-transform:uppercase; white-space:nowrap;
}
.wordmark .wm-sub{font-weight:400; opacity:.72; letter-spacing:.16em}
@media (max-width:420px){.wordmark{font-size:16px; letter-spacing:.11em}}

/* ---------- header ---------- */
.site-header{
  position:sticky; top:env(safe-area-inset-top,0px); z-index:60;
  background:color-mix(in srgb, var(--plate) 86%, transparent);
  backdrop-filter:saturate(1.3) blur(12px);
  border-bottom:1px solid var(--plate-rule);
  color:var(--plate-ink);
}
.header-in{display:flex; align-items:center; gap:28px; min-height:70px}
.header-in .brand{margin-right:auto}
.nav{display:flex; gap:30px}
.nav a{
  text-decoration:none; font-size:12.5px; letter-spacing:.11em; text-transform:uppercase;
  color:var(--plate-muted); padding-block:6px; border-bottom:1px solid transparent;
  transition:color .18s ease, border-color .18s ease;
}
.nav a:hover{color:var(--plate-ink); border-bottom-color:var(--plate-accent)}
@media (max-width:900px){.nav{display:none}}

.btn{
  display:inline-flex; align-items:center; gap:10px; cursor:pointer;
  font-family:var(--font-body); font-size:12.5px; font-weight:500;
  letter-spacing:.12em; text-transform:uppercase; text-decoration:none;
  padding:12px 22px; border-radius:2px;
  border:1px solid var(--accent); background:var(--accent); color:#fff;
  transition:background .2s ease, border-color .2s ease, color .2s ease;
}
:root[data-theme="dark"] .btn, :root:not([data-theme="light"]) .btn{color:#070B12}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .btn{color:#fff}}
.btn:hover{background:var(--accent-bright); border-color:var(--accent-bright)}
.btn-line{background:transparent; color:var(--ink); border-color:var(--rule)}
.btn-line:hover{background:transparent; color:var(--accent); border-color:var(--accent)}
.btn-plate{background:transparent; color:var(--plate-ink); border-color:#33415A}
.btn-plate:hover{background:transparent; color:var(--plate-accent); border-color:var(--plate-accent)}
.btn-sm{padding:10px 18px; font-size:11.5px}
@media (max-width:640px){.header-in .btn{display:none}}

/* ---------- masthead plate ---------- */
.plate{
  position:relative; overflow:hidden;
  background:var(--plate); color:var(--plate-ink);
}
.plate::before{
  content:""; position:absolute; inset:-30% -10% auto -10%; height:150%;
  background:
    radial-gradient(60% 70% at 22% 8%, rgba(46,104,214,.34), transparent 62%),
    radial-gradient(48% 60% at 86% 90%, rgba(26,63,143,.30), transparent 66%);
  pointer-events:none;
}
.plate::after{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}
.plate > .wrap{position:relative; z-index:1}

.kicker{
  display:inline-flex; align-items:center; gap:12px; flex-wrap:wrap;
  font-family:var(--font-mono); font-size:11px; font-weight:500;
  letter-spacing:.17em; text-transform:uppercase; color:var(--plate-accent);
  border:1px solid var(--plate-rule); border-radius:2px; padding:8px 14px;
}
.kicker .dot{width:4px; height:4px; border-radius:50%; background:var(--plate-accent); flex:none}

.hero{padding-block:96px 0}
@media (max-width:760px){.hero{padding-block:64px 0}}
.hero h1{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(42px,7vw,86px); line-height:1.02; letter-spacing:-.025em;
  margin-top:30px; max-width:15ch;
}
.hero h1 em{font-style:italic; color:var(--plate-accent)}
.hero .lede{
  margin-top:28px; max-width:var(--measure);
  font-size:18.5px; line-height:1.68; color:var(--plate-muted);
}
.hero-actions{display:flex; flex-wrap:wrap; gap:14px; margin-top:38px}

.ledger{
  margin-top:72px; border-top:1px solid var(--plate-rule);
  display:grid; grid-template-columns:repeat(4,1fr);
}
@media (max-width:800px){.ledger{grid-template-columns:repeat(2,1fr)}}
.ledger > div{padding:26px 26px 34px; border-left:1px solid var(--plate-rule)}
.ledger > div:first-child{border-left:0; padding-left:0}
@media (max-width:800px){
  .ledger > div:nth-child(odd){border-left:0; padding-left:0}
  .ledger > div:nth-child(n+3){border-top:1px solid var(--plate-rule)}
}
.ledger .v{
  font-family:var(--font-mono); font-size:16.5px; font-weight:500;
  font-variant-numeric:tabular-nums; line-height:1.4; color:var(--plate-ink);
}
.ledger .k{
  margin-top:9px; font-size:10.5px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--plate-muted);
}

/* load sequence — settles on its own, no scrolling required */
.rise{animation:rise .56s cubic-bezier(.2,.7,.2,1) both}
.d1{animation-delay:.06s} .d2{animation-delay:.14s} .d3{animation-delay:.22s} .d4{animation-delay:.3s}
@keyframes rise{from{opacity:0; transform:translateY(14px)} to{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){
  .rise{animation:none}
  .row::before{transition:none}
}

/* ---------- section furniture ---------- */
section{border-top:1px solid var(--rule)}
.sec{padding-block:88px}
@media (max-width:760px){.sec{padding-block:58px}}

.eyebrow{
  font-family:var(--font-mono); font-size:10.5px; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; color:var(--accent);
  display:flex; align-items:center; gap:12px; padding-top:9px;
}
.eyebrow::before{content:""; width:26px; height:1px; background:var(--accent); flex:none}

.sec-head{display:grid; grid-template-columns:215px 1fr; gap:40px; align-items:start; margin-bottom:54px}
@media (max-width:880px){.sec-head{grid-template-columns:1fr; gap:16px; margin-bottom:36px}}
.sec-title{
  font-family:var(--font-display); font-weight:400;
  font-size:clamp(30px,4.2vw,46px); line-height:1.1; letter-spacing:-.018em;
}
.sec-lede{color:var(--muted); font-size:17px; max-width:54ch; margin-top:16px}

/* ---------- services ---------- */
.rows{border-top:1px solid var(--rule)}
.row{
  display:grid; grid-template-columns:215px 1fr 310px; gap:40px;
  padding-block:32px; border-bottom:1px solid var(--rule); position:relative;
}
@media (max-width:980px){.row{grid-template-columns:1fr; gap:12px; padding-block:26px}}
.row::before{
  content:""; position:absolute; left:0; top:-1px; width:0; height:2px;
  background:var(--accent); transition:width .5s cubic-bezier(.2,.7,.3,1);
}
.row:hover::before{width:100%}
.row h3{
  font-family:var(--font-display); font-size:23px; font-weight:500; letter-spacing:-.008em;
}
.row .desc{color:var(--muted); font-size:15.5px; min-width:0}
.row .ex{font-size:13.5px; color:var(--muted); min-width:0; line-height:1.75}
.row .ex span{
  display:block; font-family:var(--font-mono); font-size:10px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--accent); margin-bottom:10px;
}

/* ---------- statement band ---------- */
.statement{background:var(--tint)}
.statement .wrap{padding-block:84px}
@media (max-width:760px){.statement .wrap{padding-block:56px}}
.statement blockquote{
  margin:0; font-family:var(--font-display); font-style:italic; font-weight:400;
  font-size:clamp(25px,3.6vw,40px); line-height:1.3; letter-spacing:-.012em;
  max-width:24ch;
}
.statement .attrib{
  margin-top:26px; font-family:var(--font-mono); font-size:11px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
}

/* ---------- about ---------- */
.about-grid{display:grid; grid-template-columns:1fr 420px; gap:64px; align-items:start}
@media (max-width:940px){.about-grid{grid-template-columns:1fr; gap:40px}}
.prose p{max-width:var(--measure); color:var(--muted); font-size:16.5px}
.prose p + p{margin-top:17px}
.prose strong{color:var(--ink); font-weight:600}
.ticks{list-style:none; padding:0; margin:30px 0 0; display:grid; gap:12px}
.ticks li{display:grid; grid-template-columns:22px 1fr; gap:12px; font-size:15.5px}
.ticks li::before{content:"—"; color:var(--accent); font-family:var(--font-mono)}

.record{
  position:relative; border:1px solid var(--rule); background:var(--surface);
  box-shadow:0 1px 2px rgba(10,18,32,.04), 0 12px 36px -22px rgba(10,18,32,.26);
}
.record::before,.record::after{
  content:""; position:absolute; width:9px; height:9px; border:1px solid var(--accent);
}
.record::before{top:-1px; left:-1px; border-right:0; border-bottom:0}
.record::after{bottom:-1px; right:-1px; border-left:0; border-top:0}
.record-head{
  padding:16px 24px; border-bottom:1px solid var(--rule);
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--muted);
}
.record table{width:100%; border-collapse:collapse; font-size:14.5px}
.record td{padding:14px 24px; border-top:1px solid var(--rule-soft); vertical-align:top}
.record tr:first-child td{border-top:0}
.record td:first-child{color:var(--muted); width:44%}
.record td:last-child{font-family:var(--font-mono); font-variant-numeric:tabular-nums}
.fsp{color:var(--accent); font-weight:500}
.pending{color:var(--muted); font-family:var(--font-mono); font-size:13.5px}

/* ---------- governance ---------- */
.gov{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--rule); border:1px solid var(--rule);
}
@media (max-width:940px){.gov{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.gov{grid-template-columns:1fr}}
.gov > div{background:var(--surface); padding:30px 28px}
.gov h3{
  font-family:var(--font-display); font-size:18px; font-weight:500;
  margin-bottom:11px; display:flex; gap:10px; align-items:baseline;
}
.gov h3::before{content:"\00A7"; color:var(--accent); font-family:var(--font-mono); font-size:13px}
.gov p{font-size:14.5px; color:var(--muted)}
.gov a{color:var(--accent); text-underline-offset:3px}

/* ---------- contact ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start}
@media (max-width:880px){.contact-grid{grid-template-columns:1fr; gap:44px}}
.cline{
  display:grid; grid-template-columns:130px 1fr; gap:20px;
  padding-block:17px; border-bottom:1px solid var(--rule-soft); font-size:15px;
}
.cline:first-of-type{border-top:1px solid var(--rule-soft)}
.cline dt{
  color:var(--muted); font-size:10.5px; letter-spacing:.16em;
  text-transform:uppercase; padding-top:4px; font-family:var(--font-mono);
}
.cline dd{margin:0; font-family:var(--font-mono); font-size:14px; word-break:break-word}
.copy{
  background:none; border:1px solid var(--rule); color:var(--muted); cursor:pointer;
  font-family:var(--font-mono); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase;
  padding:4px 9px; border-radius:2px; margin-left:10px; vertical-align:2px;
}
.copy:hover{color:var(--accent); border-color:var(--accent)}

form{display:grid; gap:18px}
label{
  display:grid; gap:9px; font-family:var(--font-mono); font-size:10.5px;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
}
input,textarea{
  font-family:var(--font-body); font-size:15.5px; color:var(--ink);
  background:var(--surface); border:1px solid var(--rule); border-radius:2px;
  padding:13px 14px; width:100%; text-transform:none; letter-spacing:normal;
}
input:focus,textarea:focus{outline:2px solid var(--accent); outline-offset:1px; border-color:var(--accent)}
textarea{resize:vertical; min-height:128px}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.form-note{font-size:13.5px; color:var(--muted)}
.sent{font-size:13.5px; color:var(--accent); font-family:var(--font-mono)}
a:focus-visible,button:focus-visible{outline:2px solid var(--accent); outline-offset:2px}

/* ---------- footer ---------- */
.site-footer{background:var(--plate); color:var(--plate-ink); padding-block:62px 40px}
.foot-grid{display:grid; grid-template-columns:2fr 1fr 1.4fr 1fr; gap:44px}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr; gap:34px}}
@media (max-width:540px){.foot-grid{grid-template-columns:1fr}}
.foot-grid h4{
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.18em;
  text-transform:uppercase; color:var(--plate-muted); margin:0 0 16px; font-weight:500;
}
.foot-grid ul{list-style:none; margin:0; padding:0; display:grid; gap:10px; font-size:14.5px}
.foot-grid a{text-decoration:none; color:var(--plate-muted)}
.foot-grid a:hover{color:var(--plate-accent)}
.foot-brand p{font-size:14px; color:var(--plate-muted); margin-top:14px}
.foot-tel{font-family:var(--font-mono); font-size:13px; color:var(--plate-ink); display:inline-block; margin-top:8px}
.reg-line{font-family:var(--font-mono); font-size:13px; line-height:1.85; color:var(--plate-ink)}
.reg-line .fsp{color:var(--plate-accent)}
.colophon{
  margin-top:52px; padding-top:24px; border-top:1px solid var(--plate-rule);
  display:flex; flex-wrap:wrap; gap:10px 28px; justify-content:space-between;
  font-size:11.5px; color:var(--plate-muted); font-family:var(--font-mono); letter-spacing:.06em;
}


/* --- standalone additions --- */
html{-webkit-text-size-adjust:100%}
body{margin:0}
img{max-width:100%; height:auto}
.clist{margin:0}
.note-gap{margin-top:22px}
.visually-hidden{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}
.skip-link{
  position:absolute; left:-9999px; top:0; z-index:100;
  background:var(--accent); color:#fff; padding:12px 18px;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase;
}
.skip-link:focus{left:0}

:root[data-theme="dark"] .btn-plate,:root:not([data-theme="light"]) .btn-plate{color:var(--plate-ink)}
:root[data-theme="dark"] .btn-line,:root:not([data-theme="light"]) .btn-line{color:var(--ink)}
:root[data-theme="dark"] .btn-plate:hover,:root:not([data-theme="light"]) .btn-plate:hover{color:var(--plate-accent)}
:root[data-theme="dark"] .btn-line:hover,:root:not([data-theme="light"]) .btn-line:hover{color:var(--accent)}
@media (prefers-color-scheme:light){:root:not([data-theme="dark"]) .btn-plate{color:var(--plate-ink)}:root:not([data-theme="dark"]) .btn-line{color:var(--ink)}}
