/* Layout concept: a dark opening screen, then quiet reading pages. The blue bar from the logo's E runs off the page edge as the one signature gesture. */
:root{--ink:#0d1520;--ink-2:#1a2534;--blue:#3d82f7;--paper:#f5f4ef;--white:#fff;--muted:#526071;--line:#d8dadb;
--display:"Montserrat","Helvetica Neue",Arial,sans-serif;--body:"Source Serif 4",Georgia,serif;--gutter:max(20px,env(safe-area-inset-left,0px));--gutter-r:max(20px,env(safe-area-inset-right,0px));--wide:1160px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--white);color:var(--ink);font:400 1.125rem/1.65 var(--body)}
img{display:block;max-width:100%;height:auto}a{color:inherit}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.skip{position:absolute;left:-999px;top:8px;background:var(--white);color:var(--ink);padding:8px 14px;z-index:5;font-family:var(--display)}.skip:focus{left:12px}
.wrap{max-width:var(--wide);margin-inline:auto;width:100%}
.band{padding-left:var(--gutter);padding-right:var(--gutter-r)}
h1,h2,h3{font-family:var(--display);font-weight:800;line-height:1.08;letter-spacing:-.02em;margin:0;text-wrap:balance}
p{margin:0}.measure{max-width:62ch}.stack{display:grid;gap:1.1em}
.site-header{background:var(--ink);color:var(--paper)}
.site-header .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 32px;padding-block:18px}
.brand img{width:172px}
nav ul{display:flex;gap:28px;list-style:none;margin:0;padding:0}
nav a{font:600 .95rem/1 var(--display);text-decoration:none;padding-block:8px;display:block;border-bottom:3px solid transparent}
nav a:hover{border-color:var(--paper)}nav a[aria-current=page]{border-color:var(--blue)}
.hero{background:var(--ink);color:var(--paper);overflow:hidden}
.hero .wrap{padding-block:clamp(56px,10vw,120px) clamp(64px,10vw,128px)}
.hero h1{font-size:clamp(2.5rem,8.2vw,6.6rem);letter-spacing:-.03em}.hero h1 span{display:block}
.bar{height:clamp(14px,1.8vw,22px);background:var(--blue);margin-block:clamp(28px,4vw,44px);width:100vw;transform-origin:left;animation:draw 1s cubic-bezier(.2,.7,.2,1) both}
@keyframes draw{from{transform:scaleX(.08)}to{transform:scaleX(1)}}
.hero p{font-size:clamp(1.2rem,2vw,1.45rem);line-height:1.5;max-width:44ch}
.section{padding-block:clamp(56px,8vw,104px)}
.section h2{font-size:clamp(1.9rem,4vw,3rem)}
.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:32px clamp(32px,6vw,88px)}
.formats{list-style:none;margin:28px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px 28px;font:600 1rem/1.3 var(--display)}
.feature{background:var(--blue);color:var(--ink)}
.feature .wrap{padding-block:clamp(56px,8vw,104px);display:grid;gap:24px}
.feature .kicker{font:600 1.05rem/1.3 var(--display)}
.show{font-size:clamp(2.3rem,7vw,5.5rem);letter-spacing:-.03em;max-width:none}
.show span{display:block}.show .small{font-size:.52em;font-weight:600;letter-spacing:-.01em;margin-top:.25em}
.button{display:inline-block;font:700 1rem/1 var(--display);padding:16px 22px;background:var(--ink);color:var(--paper);text-decoration:none;justify-self:start;border:2px solid var(--ink)}
.button:hover{background:transparent;color:var(--ink)}
.page-head{background:var(--ink);color:var(--paper)}
.page-head .wrap{padding-block:clamp(44px,7vw,84px) clamp(48px,7vw,88px);display:grid;gap:18px}
.page-head h1{font-size:clamp(2.4rem,6vw,4.5rem);letter-spacing:-.03em}
.page-head p{font-size:1.25rem;line-height:1.5;max-width:46ch}
.tenets{display:grid;gap:clamp(36px,5vw,56px)}
.tenet{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:12px clamp(32px,6vw,88px);padding-top:clamp(28px,4vw,40px);border-top:6px solid var(--ink)}
.tenet h2{font-size:clamp(1.6rem,3vw,2.2rem)}
.promise{background:var(--paper)}.promise ul{margin:0;padding-left:1.2em;display:grid;gap:.6em}
.people{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px clamp(32px,6vw,88px)}
.person{border-top:6px solid var(--ink);padding-top:22px;display:grid;gap:8px}
.person h2{font-size:clamp(1.5rem,3vw,2rem)}.person p{color:var(--muted)}
.person a{font:600 1rem/1.5 var(--display);overflow-wrap:anywhere;color:var(--ink)}
.note{font-size:1rem;line-height:1.6;color:var(--muted)}
.site-footer{background:var(--ink);color:var(--paper);font:500 .92rem/1.5 var(--display)}
.site-footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 32px;padding-block:32px}
.site-footer img{width:48px}
@media (max-width:760px){.two,.tenet,.people{grid-template-columns:minmax(0,1fr)}.brand img{width:150px}nav ul{gap:22px}}
@media (prefers-reduced-motion:reduce){.bar{animation:none}}
