/* Responsible AI Solutions — design system
   Paper white / navy ink. Instrument Serif display, Instrument Sans body, Geist Mono labels. */

@font-face{font-family:'Instrument Serif';src:url('fonts/InstrumentSerif-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Serif';src:url('fonts/InstrumentSerif-Italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('fonts/InstrumentSans-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('fonts/InstrumentSans-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Geist Mono';src:url('fonts/GeistMono-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}

:root{
  --paper:#FFFFFF;
  --navy:#0A1F3C;
  --navy-2:#122B4E;
  --body:#43536B;
  --soft:#8593A8;
  --line:#E7ECF3;
  --blue:#4C8DFF;
  --on-navy:#F4F7FB;
  --on-navy-body:#A9B7CC;
  --on-navy-dim:#5F7396;
  --on-navy-line:#24406B;
  --serif:'Instrument Serif',Georgia,serif;
  --sans:'Instrument Sans',-apple-system,'Segoe UI',sans-serif;
  --mono:'Geist Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --wrap:1080px;
  --measure:66ch;
  --col:44rem;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{background:var(--paper);color:var(--body);font-family:var(--sans);font-size:1.0625rem;line-height:1.7;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 clamp(20px,4vw,48px)}

::selection{background:var(--navy);color:var(--paper)}

a{color:var(--navy);text-decoration:none}
main a:not(.btn):not(.plain){text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:var(--soft)}
main a:not(.btn):not(.plain):hover{text-decoration-color:var(--navy)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:2px}

.skip{position:absolute;left:-9999px;top:0;background:var(--navy);color:#fff;padding:10px 16px;z-index:100;font-family:var(--sans)}
.skip:focus{left:12px;top:12px}

/* ---------- header ---------- */
header.site{background:var(--navy);border-bottom:1px solid #16325A}
.nav{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 0;flex-wrap:nowrap}
.wordmark{display:flex;align-items:center;gap:12px;white-space:nowrap;flex:none;font-family:var(--sans);font-weight:500;font-size:.8125rem;letter-spacing:.14em;color:#F4F7FB;text-transform:uppercase}
.logo{width:26px;height:auto;display:block;flex:none}
.logo-sm{width:21px}
.wm-text{display:inline-flex;align-items:center;gap:8px}
.wpoint{width:6px;height:6px;background:var(--blue);display:inline-block;flex:none}
.nav ul{display:flex;gap:clamp(14px,2.2vw,26px);list-style:none;flex-wrap:nowrap;white-space:nowrap;overflow-x:auto;min-width:0;scrollbar-width:none}
.nav ul::-webkit-scrollbar{display:none}
.nav ul a{font-size:.875rem;color:#A9B7CC;padding-bottom:2px;border-bottom:1px solid transparent}
.nav ul a:hover{color:#FFFFFF}
.nav ul a[aria-current="page"]{color:#FFFFFF;border-bottom-color:#4C8DFF}

/* ---------- type ---------- */
.eyebrow{font-family:var(--mono);font-size:.6875rem;letter-spacing:.2em;color:var(--soft);text-transform:uppercase}
h1.display{font-family:var(--serif);font-weight:400;font-size:clamp(2.7rem,6.2vw,5.4rem);line-height:1.06;letter-spacing:-0.012em;color:var(--navy);text-wrap:balance;max-width:15em}
h1.display em,.serif em{font-style:italic}
.serif{font-family:var(--serif);font-weight:400;color:var(--navy);letter-spacing:-0.008em;text-wrap:balance}
h2.serif{font-size:clamp(1.7rem,3.4vw,2.5rem);line-height:1.15}
h3.serif{font-size:clamp(1.35rem,2.4vw,1.75rem);line-height:1.2}
.lead{font-size:clamp(1.02rem,1.5vw,1.175rem);line-height:1.7;color:var(--body);max-width:var(--measure);text-wrap:pretty}
.small{font-size:.875rem;color:var(--soft)}
.mono{font-family:var(--mono)}
p{text-wrap:pretty}

/* ---------- buttons ---------- */
.btn{display:inline-block;font-family:var(--sans);font-weight:500;font-size:.9375rem;color:#fff;background:var(--navy);padding:13px 22px;border-radius:3px;border:1px solid var(--navy);cursor:pointer;transition:background .15s ease}
.btn:hover{background:var(--navy-2)}
.textlink{font-weight:500;font-size:.9375rem;color:var(--navy);border-bottom:1px solid var(--navy);padding-bottom:2px}

/* ---------- sections ---------- */
section{padding:clamp(56px,9vw,110px) 0}
section.tight{padding:clamp(40px,6vw,72px) 0}
.hero{padding:clamp(64px,10vw,128px) 0 clamp(56px,8vw,96px)}
.hero .lead{margin-top:26px}
.hero .actions{display:flex;align-items:center;gap:24px;margin-top:36px;flex-wrap:wrap}
.credline{font-family:var(--sans);font-size:.8125rem;letter-spacing:.05em;color:var(--soft);margin-top:52px}
.credline span{white-space:nowrap}

.rule{border:0;border-top:1px solid var(--line)}

/* ---------- navy panel ---------- */
.panel{background:var(--navy);color:var(--on-navy-body)}
.panel .serif{color:var(--on-navy)}
.panel .eyebrow{color:var(--on-navy-dim)}
.panel p{color:var(--on-navy-body)}
.panel a{color:var(--on-navy)}
.panel-head{display:flex;justify-content:space-between;align-items:baseline;gap:16px;flex-wrap:wrap}
.livechip{font-family:var(--mono);font-size:.6875rem;letter-spacing:.12em;color:var(--on-navy-dim)}
.livechip i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--blue);margin-right:7px;vertical-align:1px;font-style:normal}
@media (prefers-reduced-motion: no-preference){.livechip i{animation:blink 1.9s ease-in-out infinite}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
.lifecycle{width:100%;height:auto;display:block;margin-top:14px}
.panel .caption{font-size:.9375rem;line-height:1.65;max-width:none;margin-top:22px}

/* ---------- practice index rows ---------- */
.practice{padding:clamp(30px,4vw,44px) 0}
.practice + .practice{border-top:1px solid var(--line)}
.practice .idx{font-family:var(--mono);font-size:.6875rem;color:var(--soft);letter-spacing:.1em}
.practice h3{margin-top:10px}
.practice p{margin-top:12px;max-width:var(--measure)}

/* ---------- two column definition rows ---------- */
.defrow{display:grid;grid-template-columns:minmax(180px,280px) minmax(0,1fr);gap:clamp(18px,4vw,56px);padding:clamp(26px,3.5vw,40px) 0;border-top:1px solid var(--line)}
.defrow:last-of-type{border-bottom:1px solid var(--line)}
.defrow h3{font-family:var(--sans);font-weight:500;font-size:1rem;color:var(--navy);line-height:1.5}
.defrow .k{font-family:var(--mono);font-size:.6875rem;color:var(--soft);letter-spacing:.12em;display:block;margin-bottom:8px}
.defrow p{max-width:var(--measure)}
@media (max-width:640px){.defrow{grid-template-columns:1fr;gap:10px}}

/* ---------- profile blocks ---------- */
.profile{padding:clamp(30px,4vw,46px) 0;border-top:1px solid var(--line)}
.profile .role{font-family:var(--mono);font-size:.6875rem;letter-spacing:.14em;color:var(--soft);text-transform:uppercase;margin-top:8px}
.profile p{margin-top:16px;max-width:var(--measure)}
.profile .creds{font-size:.8125rem;letter-spacing:.05em;color:var(--soft);margin-top:16px}

/* ---------- article ---------- */
.article-head{padding:clamp(56px,8vw,96px) 0 clamp(28px,4vw,44px)}
.article-head h1{font-family:var(--serif);font-weight:400;font-size:clamp(2.1rem,4.6vw,3.6rem);line-height:1.1;letter-spacing:-0.01em;color:var(--navy);text-wrap:balance;max-width:18em}
.article-head .standfirst{margin-top:20px;max-width:var(--measure);font-size:1.075rem;color:var(--body)}
.byline{font-family:var(--mono);font-size:.75rem;letter-spacing:.1em;color:var(--soft);margin-top:26px;text-transform:uppercase}
.prose{max-width:var(--measure)}
.prose p{margin:0 0 1.35em}
.prose h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.45rem,2.6vw,1.9rem);color:var(--navy);margin:2em 0 .7em;line-height:1.25;text-wrap:balance}
.prose h3{font-family:var(--sans);font-weight:500;font-size:1.05rem;color:var(--navy);margin:1.8em 0 .6em}
.prose ul,.prose ol{margin:0 0 1.35em 1.25em}
.prose li{margin-bottom:.55em}
.prose li::marker{color:var(--soft);font-family:var(--mono);font-size:.85em}
.prose strong{font-weight:500;color:var(--navy)}
.callout{border-top:1px solid var(--navy);border-bottom:1px solid var(--line);padding:22px 0;margin:2.2em 0}
.callout .k{font-family:var(--mono);font-size:.6875rem;letter-spacing:.16em;color:var(--soft);text-transform:uppercase;display:block;margin-bottom:10px}
.callout p{margin:0;color:var(--navy)}
.opmodel{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:2.2em 0}
.opmodel div{background:var(--paper);padding:16px 16px 18px}
.opmodel .k{font-family:var(--mono);font-size:.6875rem;color:var(--soft);letter-spacing:.1em;display:block}
.opmodel .t{font-family:var(--sans);font-weight:500;font-size:.9375rem;color:var(--navy);display:block;margin-top:8px}
.opmodel .d{font-size:.8125rem;line-height:1.55;color:var(--body);display:block;margin-top:6px}
.footnote{font-size:.8125rem;color:var(--soft);border-top:1px solid var(--line);padding-top:18px;margin-top:3em;max-width:var(--measure)}

/* ---------- perspectives index ---------- */
.piece{padding:clamp(28px,4vw,42px) 0;border-top:1px solid var(--line)}
.piece:last-of-type{border-bottom:1px solid var(--line)}
.piece .meta{font-family:var(--mono);font-size:.6875rem;letter-spacing:.12em;color:var(--soft);text-transform:uppercase}
.piece h3 a{text-decoration:none;color:var(--navy)}
.piece h3 a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.piece p{margin-top:10px;max-width:var(--measure)}

/* ---------- footer ---------- */
footer.site{background:var(--navy);margin-top:clamp(40px,7vw,88px)}
footer.site .inner{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:20px 0;flex-wrap:nowrap}
footer.site .reg{display:flex;align-items:center;gap:11px;font-family:var(--mono);font-size:.6875rem;letter-spacing:.06em;color:#8FA1BC;white-space:nowrap;min-width:0}
footer.site .links{display:flex;gap:20px;align-items:center;flex-wrap:nowrap;white-space:nowrap}
footer.site .links a{font-size:.8125rem;color:#C9D5E6}
footer.site .links a:hover{color:#fff}

/* ---------- reveal on scroll ---------- */
@media (prefers-reduced-motion: no-preference){
  .js .reveal{opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s ease}
  .js .reveal.in{opacity:1;transform:none}
  @supports (animation-timeline: view()){
    .reveal{opacity:1;transform:none;transition:none;animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 45%}
    @keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
  }
}

/* ---------- misc ---------- */
.mt-0{margin-top:0}.mt-1{margin-top:12px}.mt-2{margin-top:20px}.mt-3{margin-top:32px}.mt-4{margin-top:48px}
.center{ text-align:center }
img{max-width:100%;height:auto}
@media print{header.site,footer.site,.actions{display:none}body{color:#000}}

/* ---------- diagrams & ornaments ---------- */
.diagram{margin:30px 0 6px;max-width:var(--col)}
.diagram svg{display:block;width:100%;height:auto;overflow:visible}
.diagram .cap{font-family:var(--mono);font-size:.6875rem;letter-spacing:.14em;color:var(--soft);text-transform:uppercase;margin-top:12px}
.hero{position:relative}
.hero .wrap{position:relative;z-index:1}
.wm{position:absolute;top:14px;right:2vw;width:clamp(150px,17vw,230px);height:auto;z-index:0;pointer-events:none}
@media(max-width:920px){.wm{display:none}}
.tickrule{display:block;width:100%;height:9px}
.piece{display:grid;grid-template-columns:96px minmax(0,1fr);gap:26px;align-items:start}
.piece .thumb{width:96px;height:64px;overflow:visible;margin-top:4px}
@media(max-width:600px){.piece{grid-template-columns:1fr}.piece .thumb{display:none}}
.artmotif{margin-top:24px}
.artmotif svg{height:32px;width:auto;overflow:visible;display:block}
.eyebrow::before{background:#5F7396}
.mailcard a.mail{font-family:var(--serif);font-size:clamp(1.4rem,3.4vw,2.4rem);color:var(--on-navy);letter-spacing:-.01em;word-break:break-word}
.mailcard a.mail:hover{color:#fff}
.mailcard .rows{margin-top:28px;border-top:1px solid var(--on-navy-line)}
.mailcard .row{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px solid var(--on-navy-line);font-family:var(--mono);font-size:.6875rem;letter-spacing:.1em}
.mailcard .row .k{color:var(--on-navy-dim);white-space:nowrap}
.mailcard .row .v{color:var(--on-navy-body);text-align:right}
.eyebrow::before{content:"";display:inline-block;width:22px;height:1px;background:currentColor;vertical-align:middle;margin-right:10px}

/* ---------- ambient line-work ---------- */
.seam{position:relative;border-top:1px solid var(--line);margin-top:clamp(36px,5.5vw,58px)}
.seam i{position:absolute;top:-3.5px;left:18%;width:7px;height:7px;border-radius:50%;background:var(--blue)}
.seam b{position:absolute;top:-6px;right:0;width:1px;height:13px;background:var(--navy)}
.panel{position:relative}
.ck{position:absolute;width:12px;height:12px;border:0 solid #24406B;pointer-events:none}
.ck.tl{top:10px;left:10px;border-top-width:1px;border-left-width:1px}
.ck.tr{top:10px;right:10px;border-top-width:1px;border-right-width:1px}
.ck.bl{bottom:10px;left:10px;border-bottom-width:1px;border-left-width:1px}
.ck.br{bottom:10px;right:10px;border-bottom-width:1px;border-right-width:1px}
.mailcard{position:relative}
footer.site{border-top:3px solid var(--blue)}
.artband{margin-top:34px}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:minmax(250px,5fr) minmax(0,7fr);gap:clamp(36px,6vw,84px);margin-top:46px;align-items:start}
@media(max-width:860px){.contact-grid{grid-template-columns:1fr;gap:38px}}
.cdetail{padding:18px 0;border-top:1px solid var(--line)}
.cdetail:first-child{border-top:0;padding-top:0}
.cdetail .k{display:block;font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);font-weight:500;margin-bottom:7px}
.cdetail .v{font-size:1.0625rem;color:var(--navy)}
.cdetail p{font-size:.9375rem;line-height:1.6;color:var(--body);max-width:26em}
.formcard{background:#FFFFFF;border:1px solid var(--line);border-radius:6px;padding:clamp(24px,3.4vw,38px)}
.formcard label{display:block;font-weight:500;font-size:.875rem;color:var(--navy);margin:20px 0 8px}
.formcard label:first-of-type{margin-top:0}
.formcard .opt{color:var(--soft);font-weight:400}
.formcard input,.formcard textarea{width:100%;font:inherit;font-size:1rem;color:var(--navy);background:#FFFFFF;border:1px solid var(--line);border-radius:4px;padding:13px 14px}
.formcard input:hover,.formcard textarea:hover{border-color:var(--soft)}
.formcard input:focus,.formcard textarea:focus{border-color:var(--blue);outline:none;box-shadow:0 0 0 3px rgba(76,141,255,.18)}
.formcard textarea{min-height:170px;resize:vertical}
.formcard .btn{width:100%;margin-top:26px}
.formnote{font-size:.8125rem;color:var(--soft);margin-top:12px;text-align:center}
@media(max-width:780px){.wordmark span{display:none}}
@media(max-width:1040px){.reg-kl{display:none}}
@media(max-width:900px){.reg-no{display:none}}
@media(max-width:640px){.reg-name{display:none}footer.site .links{gap:12px}footer.site .links a{font-size:.75rem}}