@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/CormorantGaramond-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/CormorantGaramond-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/CormorantGaramond-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:"Cormorant Garamond";font-style:italic;font-weight:500;font-display:swap;src:url(/fonts/CormorantGaramond-latin-500-italic.woff2) format('woff2')}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/CormorantGaramond-latin-ext-500-normal.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
/* Site-wide look (from the About page): navy, champagne gold and teal; Cormorant Garamond headings */
:root{--gold:#ffffff;--gold-d:#111418;--gold-l:#ffffff;--ink2:#0a45f0;--display:"Cormorant Garamond","Newsreader",Georgia,serif;--warm:#fbfaf7}
h1,h2,h3{font-family:var(--display);font-weight:500;letter-spacing:-.005em}
h1{font-size:clamp(2.6rem,5.4vw,4.6rem);line-height:1.05}h2{font-size:clamp(2.1rem,3.6vw,3.1rem)}h3{font-size:1.6rem}
.eyebrow{color:var(--gold-d);letter-spacing:.24em;display:flex;align-items:center;gap:14px}
.eyebrow:before{content:"";width:34px;height:1px;background:currentColor;flex:none}
.eyebrow.light{color:var(--gold-l)}
section.alt{background:linear-gradient(180deg,#fbfaf7,#f6f3ec)}
.mono{color:var(--gold-d);border-color:var(--gold)}.bn{font-family:var(--display);font-size:1.3rem;font-weight:500}
.nav nav a:not(.btn-sm):after{background:var(--gold)}
.btn:hover,.btn-sm:hover{background:var(--gold);border-color:var(--gold);color:var(--ink2)!important}
.btn.light:hover{background:var(--gold-l);border-color:var(--gold-l)}
.btn.ghost{border-color:rgba(255,255,255,.5)}.btn.ghost:hover{border-color:var(--gold);color:var(--gold-l);background:transparent}
.btn.line:hover{background:var(--ink2);border-color:var(--ink2);color:#fff}
.textlink{border-color:var(--gold)}.textlink:hover{color:var(--gold-d)}
a{color:#22706e}
/* heroes */
.hero.photo{background:var(--ink2);min-height:88vh}
.hero.photo .hero-bg{z-index:0}
.hero.photo:before{background:linear-gradient(90deg,rgba(8,58,215,.88) 0%,rgba(8,58,215,.5) 50%,rgba(8,58,215,.06) 100%),linear-gradient(0deg,rgba(8,58,215,.4),transparent 45%)}
.hero.photo h1{font-size:clamp(2.8rem,6vw,5.2rem)}
.hero.photo .roles{color:var(--gold-l)}
.hero .tagline,.hero.photo .tagline{font-family:var(--display);font-style:italic;font-size:clamp(1.35rem,2.1vw,1.7rem);color:var(--gold-l);border-left:1px solid var(--gold);padding-left:22px}
.hero.photo .textlink{border-color:var(--gold)}
.page-hero{background:var(--ink2);min-height:64vh;display:flex;align-items:center;padding:130px 0 110px}
.page-hero .wrap{width:100%;z-index:2}
.page-hero.img:before{z-index:1;background:linear-gradient(90deg,rgba(8,58,215,.88) 0%,rgba(8,58,215,.5) 50%,rgba(8,58,215,.08) 100%),linear-gradient(0deg,rgba(8,58,215,.4),transparent 45%)}
.page-hero h1{max-width:14em}
.page-hero .lead{font-family:var(--display);font-style:italic;font-size:clamp(1.3rem,2vw,1.6rem);line-height:1.45;color:var(--gold-l);max-width:32em;border-left:1px solid var(--gold);padding-left:22px;margin-top:1.4em}
.page-hero:not(.img):not(.ax-hero){min-height:0;padding:110px 0 80px}
/* cards and lists */
.card{border-top:2px solid var(--line)}
.card:hover{border-color:var(--gold);border-top-color:var(--gold)}
.icon{color:var(--gold-d)}
.dual .num,.cat .n{color:var(--gold-d);font-family:var(--display)}
.dual h3,.diff h3{font-weight:500}
.dual > div{transition:background .3s}.dual > div:hover{background:#fbfaf7}
.pillar li:before{background:var(--gold)}.ticks li:before{border-color:var(--gold-d)}
.note{border-left-color:var(--gold)}
.cat:hover{border-color:var(--gold)}.pub .src,.pe .src{color:var(--gold-d)}.pub a:hover h3,.chan:hover span{color:var(--gold-d)}
.chan span{font-family:var(--display);font-size:1.5rem}
.figure{position:relative;overflow:visible}.figure:before{content:"";position:absolute;inset:18px -18px -18px 18px;border:1px solid var(--gold);z-index:0}.figure img{position:relative;z-index:1}
/* timeline (shared) */
.timeline{border-left-color:rgba(255,255,255,.45)}
.role:before{border-color:var(--gold)}.role .when{color:var(--gold-d)}
/* dark sections */
.investors,.cta{background:var(--ink2)}
.cta{border-top:1px solid rgba(255,255,255,.3)}
.cta h2{font-size:clamp(1.8rem,3vw,2.5rem)}
.investors .card,.cta .card{background:rgba(255,255,255,.05)}
.videos video{border-color:rgba(255,255,255,.35)}
.videos figcaption strong{font-family:var(--display);font-size:1.5rem;font-weight:500}
.diff a{background:var(--ink2)}.diff a.ai{background:var(--ink2)}.diff a.ai img{filter:none}
.diff .in,.diff a.ai .in{background:linear-gradient(0deg,rgba(8,58,215,.95),rgba(8,58,215,.15))}
.diff span.more{color:var(--gold-l)}
.diff a{outline:1px solid transparent;outline-offset:-14px;transition:outline-color .4s}.diff a:hover{outline-color:rgba(255,255,255,.6)}
form.contact{background:#fbfaf7;border-top:2px solid var(--gold)}
form.contact input:focus,form.contact select:focus,form.contact textarea:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(255,255,255,.18)}
.foot{background:#070f19}.foot a:hover{color:var(--gold-l)}.foot .mono{color:var(--gold-l)}
.bgv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
@media (max-width:900px){.page-hero{min-height:52vh;padding:96px 0 80px}.hero.photo{min-height:72vh}.figure:before{inset:12px -12px -12px 12px}}
@media (prefers-reduced-motion:reduce){.bgv{display:none}}

/* Electric blue look: gold became white on dark backgrounds; on light backgrounds it reads as electric blue / pale blue */
.pg-about .eyebrow{color:#111418}.pg-about .eyebrow.light{color:#fff}
.ax-text p:first-child:first-letter{color:#111418}
.ax-exp .role .when{color:#111418}.ax-exp .role.now .when{color:#fff}.ax-exp .role:not(.now):before{border-color:#1a56ff}
.ax-photo:before,.figure:before{border-color:#cfdcff}
.card:hover{border-color:#cfdcff;border-top-color:#1a56ff}.cat:hover{border-color:#cfdcff}
.ax-band .card:hover,.ax-edu .card:hover,.investors .card:hover,.cta .card:hover{border-color:#fff}
.pillar li:before{background:#1a56ff}.note{border-left-color:#1a56ff}.textlink{border-color:#1a56ff}
.hero.photo .textlink,.ax-edu .textlink,.page-hero .textlink{border-color:#fff}
.nav nav a:not(.btn-sm):after{background:#1a56ff}
.role:before{border-color:#1a56ff}.timeline{border-left-color:#cfdcff}
.btn:hover,.btn-sm:hover{background:#fff;border-color:#1a56ff;color:#111418!important}
.bgv{filter:none}
.icon{color:#1a56ff}.ticks li:before{border-color:#1a56ff}

/* More original colour (Oct 11): thinner blue layers over photos and videos; blue kept mainly behind the text, plus a soft shadow on the text */
.hero.photo:before,.page-hero.img:before,.ax-hero:before{background:linear-gradient(90deg,rgba(8,58,215,.62) 0%,rgba(8,58,215,.22) 45%,rgba(8,58,215,0) 75%),linear-gradient(0deg,rgba(8,58,215,.2),transparent 35%)}
.hero.photo h1,.hero.photo p,.page-hero h1,.page-hero p,.ax-hero h1,.ax-hero p,.ax-band h2,.ax-edu h2{text-shadow:0 2px 18px rgba(0,20,90,.45)}
.ax-band:before{background:rgba(8,58,215,.18)}
.ax-edu{background:linear-gradient(rgba(8,58,215,.45),rgba(8,58,215,.55)),url(/img/insights-banner.jpg) center/cover fixed!important}
.diff a img{opacity:1;filter:none}.diff a:hover img{opacity:1}
.diff .in,.diff a.ai .in{background:linear-gradient(0deg,rgba(8,58,215,.85) 0%,rgba(8,58,215,.35) 45%,rgba(8,58,215,0) 80%)}
@media (max-width:900px){.hero.photo:before,.page-hero.img:before,.ax-hero:before{background:rgba(8,58,215,.45)}}

/* Oct 11: About timeline line back in electric blue; Education section text all white */
.ax-exp .timeline,.pg-about .timeline{border-left:2px solid #1a56ff!important}
.ax-edu,.ax-edu h2,.ax-edu h3,.ax-edu p,.ax-edu .card p,.ax-edu a,.ax-edu .textlink,.pg-about .ax-edu .eyebrow{color:#fff!important}

/* Oct 11: first (current role) timeline dot matches the others: electric blue */
.ax-exp .role.now:before{background:#fff!important;border-color:#1a56ff!important;box-shadow:0 0 0 5px rgba(26,86,255,.18)}

/* Oct 11: education boxes are not links, so they keep the hover look at all times */
.ax-edu div.card,.ax-edu div.card:hover{border-color:#fff!important;background:rgba(255,255,255,.08)!important;box-shadow:0 14px 30px -18px rgba(8,58,215,.35)!important}
.ax-edu div.card.reveal.in,.ax-edu div.card.reveal.visible,.ax-edu div.card.reveal.is-visible,.ax-edu div.card:not(.reveal),.ax-edu div.card:hover{transform:translateY(-3px)!important}

/* Oct 11: education box text more legible: darker box behind it, bolder, larger text */
.ax-edu div.card,.ax-edu div.card:hover{background:rgba(6,16,46,.72)!important;backdrop-filter:blur(3px)}
.ax-edu div.card h3{color:#fff!important;font-weight:600!important;font-size:1.3rem!important;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.ax-edu div.card p{color:#fff!important;opacity:1!important;font-size:1rem!important;font-weight:500!important;text-shadow:0 1px 3px rgba(0,0,0,.5)}

/* Oct 11: publication links turn electric blue on hover (previous hover colour matched the text) */
.pub a h3,.pub a .src{transition:color .2s ease}
.pub a:hover h3,.pub a:focus-visible h3{color:#083ad7!important}
.pub a:hover .src,.pub a:focus-visible .src{color:#083ad7!important}