/* Saudi Thought Leadership. Tokens sampled from the STL banner. */
@font-face{font-family:'Newsreader';font-style:normal;font-weight:400 700;font-display:swap;src:url(fonts/newsreader-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:400 700;font-display:swap;src:url(fonts/newsreader-italic.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/plexsans-400.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Sans';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/plexsans-600.woff2) format('woff2')}

:root{
  --green:#00241C;--green-2:#033A2C;--green-line:rgba(196,165,77,.26);
  --gold:#C4A54D;--gold-ink:#7D6220;
  --ivory:#FFFFFF;--ivory-2:#F3F5F2;--ink:#16201B;--ink-soft:#4F5A53;--ink-mute:#646C66;--line:rgba(22,32,27,.13);
  --on-green:#E9E4D2;--on-green-soft:#AEBDB2;--white:#FFFFFF;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;--sans:'IBM Plex Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --pad:clamp(20px,5vw,72px);--e-out:cubic-bezier(.23,1,.32,1);
  /* one type scale; nothing sets a size outside it */
  --f-label:.68rem;--f-small:.86rem;--f-ui:.88rem;--f-base:1.06rem;--f-body:1.12rem;
  --f-lead:clamp(1.18rem,1.8vw,1.34rem);--f-h3:clamp(1.3rem,2.2vw,1.55rem);
  --f-h2:clamp(1.55rem,3vw,2rem);--f-h1:clamp(1.9rem,4.4vw,2.9rem);
  --f-hero:clamp(2.1rem,5.2vw,3.9rem);--f-num:clamp(1.9rem,3.4vw,2.4rem);
  /* one spacing scale; every section breathes by these three steps */
  --s1:clamp(18px,2.4vw,26px);--s2:clamp(30px,4vw,44px);--s3:clamp(44px,6vw,60px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--ivory);color:var(--ink);line-height:1.6;font-size:17px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.nav :focus-visible,.hero :focus-visible,.ehead :focus-visible,.foot :focus-visible{outline-color:var(--gold)}
.skip{position:absolute;left:-9999px;top:0;z-index:20;background:var(--gold);color:var(--green);font-size:var(--f-label);font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:14px 20px}
.skip:focus{left:0}
.wrap{max-width:1160px;margin:0 auto;padding-inline:var(--pad)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* nav */
.nav{position:relative;background:var(--green);border-bottom:1px solid var(--green-line)}
.right{display:flex;align-items:center;gap:26px}
.menu{display:none}
.links .mo{display:none}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-block:12px}
.logo{display:flex;text-decoration:none;min-width:0}
.lk{display:inline-flex;align-items:center;gap:.36em;font-family:var(--serif);color:var(--green);line-height:1}
.lk .stl{font-weight:600;font-size:1.6em;letter-spacing:-.035em;line-height:1;color:var(--gold)}
.lk .bar{width:1px;height:1.05em;background:var(--gold);flex:none}
.lk .nmt{display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.lk .nm{font-weight:500;font-size:.98em;letter-spacing:.02em;white-space:nowrap;color:var(--on-green)}
.lk .tg{font-style:italic;font-size:.76em;letter-spacing:0;white-space:nowrap;color:var(--gold)}
.lk.tagged .bar{align-self:stretch;height:auto;margin:.12em 0}
.logo .lk{font-size:var(--f-base)}
.links{display:flex;align-items:center;gap:26px;list-style:none;font-size:var(--f-ui)}
.links a{text-decoration:none;color:var(--on-green-soft);transition:color .2s var(--e-out)}
.links a[aria-current]{color:var(--on-green);font-weight:600}
.right .cta{text-decoration:none;background:var(--gold);color:var(--green);padding:8px 16px;font-size:var(--f-label);font-weight:600;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;transition:background .2s var(--e-out),color .2s var(--e-out)}
@media (any-hover:hover) and (any-pointer:fine){
  .links a:hover{color:var(--white)}
  .right .cta:hover{background:var(--on-green);color:var(--green)}
}
@media (max-width:620px){
  .logo .lk{font-size:1rem}.lk .tg{display:none}
  .right{gap:10px}
  .menu{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;background:none;border:0;color:var(--gold);cursor:pointer}
  .menu svg{width:20px;height:14px}.menu .x{display:none;width:14px}
  .nav.open .menu .h{display:none}.nav.open .menu .x{display:block}
  .links{display:none}
  .nav.open .links{display:flex;flex-direction:column;align-items:stretch;gap:0;position:absolute;left:0;right:0;top:100%;z-index:10;background:var(--green-2);border-bottom:1px solid var(--green-line);padding:6px 0 10px}
  .nav.open .links li a{display:block;padding:14px 16px;font-size:var(--f-base)}
  .links .mo{display:block}
}
@media (max-width:380px){.lk .nmt,.lk .bar{display:none}}

/* weave */
.weave{background:var(--green);padding-bottom:6px}
.weave svg{display:block;width:100%;height:50px}
.weave.thin{padding-bottom:6px}
.weave.thin svg{height:36px}

/* the field: pattern under the content, not beside it */
.hero,.ehead{position:relative;overflow:hidden;isolation:isolate}
.cloth{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.8}
.hero .wrap,.ehead .wrap{position:relative;z-index:1}

/* front page: lead with the newest edition's argument */
.hero{background:var(--green);color:var(--on-green);padding:var(--s3) 0 var(--s2)}
.hero h1{font-family:var(--serif);font-weight:600;font-size:var(--f-hero);line-height:1.06;letter-spacing:-.015em;color:var(--white);max-width:20ch;text-wrap:balance}
.hero .dek{font-family:var(--serif);font-size:var(--f-lead);color:var(--on-green-soft);max-width:54ch;margin-top:20px}
.hero .go{display:inline-block;margin-top:24px;font-size:var(--f-label);font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--gold);border-bottom:1px solid var(--gold);padding-bottom:4px;transition:color .2s var(--e-out),border-color .2s var(--e-out)}
@media (any-hover:hover) and (any-pointer:fine){.hero .go:hover{color:var(--white);border-color:var(--white)}}

/* a guest's face, beside their own words */
.face-lg,.ed .face,.nx img,.ft .face{border-radius:50%;object-fit:cover;object-position:center top;
  border:1px solid var(--gold);box-shadow:0 0 0 4px var(--ring-gap),0 0 0 5px var(--ring-2)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(22px,4vw,54px);align-items:center}
.face-lg{width:clamp(96px,13vw,156px);height:clamp(96px,13vw,156px)}
.fig{display:block;width:clamp(150px,18vw,220px);height:auto;aspect-ratio:2/3;object-fit:cover;object-position:center top;border:1px solid var(--gold);box-shadow:0 0 0 4px #FFFFFF,0 0 0 5px rgba(125,98,32,.34)}
:root{--ring-gap:#FFFFFF;--ring-2:rgba(125,98,32,.34)}
.hero,.ehead{--ring-gap:var(--green);--ring-2:rgba(196,165,77,.5)}
@media (max-width:700px){
  .hero-grid{grid-template-columns:1fr;gap:24px}
  .hero-grid .face-lg{order:-1;width:92px;height:92px}
}

.lab{display:block;font-size:var(--f-label);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-mute);padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:var(--s1)}

/* the conversation being prepared: outside the numbering, since it has no number yet */
.next{padding-block:var(--s2) 0}
.nx{display:flex;align-items:center;gap:clamp(16px,2.5vw,24px)}
.nx img{width:92px;height:92px;flex:none;margin-left:5px}
.nx .who,.ft .who{font-family:var(--serif);font-weight:600;font-size:var(--f-h3);color:var(--green);line-height:1.2}
.nx .role,.ft .role{font-size:var(--f-small);color:var(--ink-mute);margin-top:4px}
.feat{padding-block:var(--s2) 0}
.ft{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(16px,2.5vw,24px);align-items:start}
.ft .face{width:92px;height:92px;margin:6px 0 0 5px}
.ft h2{font-family:var(--serif);font-weight:600;font-size:var(--f-h2);line-height:1.15;letter-spacing:-.01em;color:var(--green);max-width:28ch;margin-top:14px;text-wrap:balance}
.ft h2 a{color:inherit;text-decoration:none}
.ft .sum{font-family:var(--serif);font-size:var(--f-lead);color:var(--ink-soft);max-width:54ch;margin-top:12px}
.feat .go{display:inline-block;margin-top:18px;font-size:var(--f-label);font-weight:600;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--gold-ink);border-bottom:1px solid var(--gold-ink);padding-bottom:4px}
@media (max-width:560px){.ft{grid-template-columns:1fr}}
.nx .soon{margin-left:auto;font-size:var(--f-label);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink);white-space:nowrap}
@media (max-width:560px){.nx{flex-wrap:wrap}.nx .soon{margin-left:0}}

/* the archive: one continuous sequence, conversations included */
.library{padding-block:var(--s2) 0}
.library h2{font-size:var(--f-label);font-family:var(--sans);font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-mute);padding-bottom:12px;border-bottom:1px solid var(--line)}
.eds{list-style:none}
.ed{display:grid;grid-template-columns:4.2rem minmax(0,1fr);gap:4px 22px;padding:var(--s1) 0;border-bottom:1px solid var(--line)}
.ed:last-child{border-bottom:0}
.ed .no{font-family:var(--serif);font-weight:600;font-size:var(--f-num);line-height:1;color:var(--gold-ink);font-variant-numeric:tabular-nums;grid-row:span 3}
.ed .when{font-size:var(--f-label);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute)}
.ed h3{font-family:var(--serif);font-weight:600;font-size:var(--f-h3);line-height:1.2;letter-spacing:-.005em;max-width:32ch;margin-top:6px;text-wrap:balance}
.ed h3 a{text-decoration:none;background-image:linear-gradient(var(--gold),var(--gold));background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .45s var(--e-out)}
.ed p{font-family:var(--serif);font-size:var(--f-base);color:var(--ink-soft);max-width:60ch;margin-top:8px}
.ed.talk{grid-template-columns:4.2rem 92px minmax(0,1fr)}
.ed.talk .when,.ed.talk h3,.ed.talk p{grid-column:3}
.ed .face{grid-column:2;grid-row:1/span 3;align-self:center;width:92px;height:92px}
.ed .ed-b{grid-column:3}
.ed .ed-b .who{font-family:var(--serif);font-weight:600;font-size:var(--f-h3);color:var(--green);line-height:1.2;margin-top:8px}
.ed .ed-b .role{font-size:var(--f-small);color:var(--ink-mute);margin-top:4px}
.ed .ed-b h3{margin-top:14px;max-width:34ch}
.ed .ed-b>p:last-child{margin-top:8px}
.ed:has(.ed-b) .face{grid-row:1;align-self:start;margin-top:26px}
@media (any-hover:hover) and (any-pointer:fine){.ed h3 a:hover{background-size:100% 1px}}
@media (max-width:560px){
  .ed,.ed.talk{grid-template-columns:1fr}
  .ed .no{grid-row:auto;font-size:var(--f-num);margin-bottom:8px}
  .ed.talk .when,.ed.talk h3,.ed.talk p{grid-column:1}
  .ed .ed-b{grid-column:1}
  .ed:has(.ed-b) .face{margin-top:0}
  .ed .face{grid-column:1;grid-row:auto;order:-1;margin-bottom:6px}
}

/* the weave, reduced to a rule, inside the white */
.weave-rule{padding-block:var(--s1)}
.weave-rule svg{display:block;width:100%;height:22px}
.weave-rule + .panel{border-top:0;padding-top:var(--s2)}

/* forms: subscribe + nominate */
.panel{border-top:1px solid var(--line);padding-block:var(--s3)}
.panel.deep{background:var(--ivory-2)}
.panel-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:start}
@media (max-width:820px){.panel-grid{grid-template-columns:1fr}}
.kick{display:block;font-family:var(--serif);font-style:italic;font-size:var(--f-base);color:var(--gold-ink);margin-bottom:10px}
.panel h2{font-family:var(--serif);font-weight:600;font-size:var(--f-h2);line-height:1.1;letter-spacing:-.01em;color:var(--green);text-wrap:balance}
.panel .lead{font-family:var(--serif);font-size:var(--f-base);color:var(--ink-soft);margin-top:14px;max-width:48ch}
.panel .fine{font-size:var(--f-small);color:var(--ink-mute);margin-top:14px;max-width:52ch}
.panel .fine a{color:var(--gold-ink)}
.form{display:grid;grid-template-columns:1fr 1fr;gap:16px 22px}
.form .full{grid-column:1/-1}
.form label{display:block;font-size:var(--f-label);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:2px}
.form input,.form select,.form textarea{width:100%;font-family:var(--serif);font-size:var(--f-body);line-height:1.45;color:var(--ink);background:transparent;border:0;border-bottom:1px solid rgba(22,32,27,.32);padding:8px 0;border-radius:0;transition:border-color .2s var(--e-out)}
.form textarea{height:calc(1.45em + 17px);min-height:0;resize:none;overflow:hidden;line-height:1.45;display:block}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-bottom-color:var(--gold-ink)}
.form .hidden{display:none}
.btn{grid-column:1/-1;justify-self:start;background:var(--green);color:var(--on-green);border:0;cursor:pointer;font-family:var(--sans);font-size:var(--f-label);font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:15px 26px;transition:background .2s var(--e-out)}
.btn:disabled{opacity:.6;cursor:progress}
@media (any-hover:hover) and (any-pointer:fine){.btn:hover{background:var(--green-2)}}
.status{grid-column:1/-1;font-size:var(--f-small)}
.status.ok{color:var(--gold-ink)}
.status.err{color:#8E2F22}
.sub-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 18px;align-items:center}
.sub-form .btn,.sub-form .li-btn{grid-column:2;justify-self:stretch;justify-content:center;min-width:236px;height:48px;padding:0 24px;box-sizing:border-box}
.sub-form .also{font-family:var(--serif);font-style:italic;font-size:var(--f-base);color:var(--ink-mute)}
.sub-form .status,.sub-form .fine{grid-column:1/-1}
.li-btn{display:inline-flex;align-items:center;gap:10px;background:var(--green);color:var(--on-green);text-decoration:none;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:14px 22px}
.li-btn svg{width:17px;height:17px;fill:currentColor}
@media (any-hover:hover) and (any-pointer:fine){.li-btn:hover{background:var(--green-2)}}
@media (max-width:560px){.form{grid-template-columns:1fr}}

/* edition header */
.ehead{background:var(--green);color:var(--on-green);padding:var(--s3) 0 var(--s2)}
.ehead .kicker{display:block;font-family:var(--serif);font-style:italic;font-size:var(--f-base);color:var(--gold);margin-bottom:14px}
.ehead h1{font-family:var(--serif);font-weight:600;font-size:var(--f-h1);line-height:1.08;letter-spacing:-.012em;color:var(--white);max-width:22ch;text-wrap:balance}
.ehead h1 em{font-weight:500;color:var(--gold)}
.ehead .by{font-size:var(--f-small);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--on-green-soft);margin-top:20px}
.ehead .by b{color:var(--gold);font-weight:600}
.ehead .stand{font-family:var(--serif);font-style:italic;font-size:var(--f-lead);line-height:1.45;color:var(--on-green);max-width:56ch;margin-top:18px}

/* article body */
.body{max-width:812px;margin:0 auto;padding:var(--s3) var(--pad) 0}
.body>p{font-family:var(--serif);font-size:var(--f-body);line-height:1.68;margin-bottom:1.1em}
.body .lead{font-size:var(--f-lead);line-height:1.5;margin-bottom:1.2em}
.body h2{font-family:var(--serif);font-weight:600;font-size:var(--f-h2);line-height:1.18;letter-spacing:-.008em;color:var(--green);margin:1.9em 0 .65em;text-wrap:balance}
.body h3{font-family:var(--serif);font-weight:600;font-size:var(--f-h3);line-height:1.25;color:var(--ink);margin:1.6em 0 .5em}
.body ul,.body ol{list-style:none;margin:0 0 1.2em}
.body li{position:relative;font-family:var(--serif);font-size:var(--f-base);line-height:1.55;color:var(--ink-soft);padding:4px 0 4px 20px}
.body li::before{content:"";position:absolute;left:1px;top:.78em;width:5px;height:5px;background:var(--gold-ink);transform:rotate(45deg)}
.body li b,.body li strong{color:var(--ink)}
.body ol{counter-reset:n}
.body ol>li{counter-increment:n;padding-left:32px}
.body ol>li::before{content:counter(n,decimal-leading-zero);top:.2em;width:auto;height:auto;background:none;transform:none;font-weight:600;color:var(--gold-ink);font-size:.95em}
.body blockquote{font-family:var(--serif);font-style:italic;font-size:var(--f-lead);line-height:1.5;color:var(--green);border-left:2px solid var(--gold);padding:4px 0 4px 22px;margin:1.6em 0}
.body blockquote cite{display:block;font-family:var(--sans);font-style:normal;font-size:var(--f-label);font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink);margin-top:10px}
.body hr{border:0;height:1px;background:var(--line);margin:2.2em 0}
.art-rule{display:flex;align-items:center;justify-content:center;gap:14px;margin:2.4em auto}
.art-rule::before,.art-rule::after{content:"";height:1px;width:clamp(40px,8vw,64px);background:var(--gold)}
.art-rule i{width:9px;height:9px;border:1.5px solid var(--gold-ink);transform:rotate(45deg);flex:none}
.ask{background:var(--green);color:var(--on-green);padding:clamp(26px,4vw,40px);margin:2.2em 0 0}
.ask h2,.ask h3{color:var(--gold);margin:0 0 .8em;font-size:1.32rem}
.ask li{color:var(--on-green)}
.ask li::before{background:var(--gold)}
.ask li b,.ask li strong{color:var(--white)}
.ask p{font-family:var(--serif);color:var(--on-green);margin-bottom:1em}
.brief{background:var(--ivory-2);padding:clamp(22px,3vw,30px);margin:0 0 2em}
.brief .k,.guest .k{display:block;font-size:var(--f-label);font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:12px}
.guest{border-top:1px solid var(--line);margin-top:2.4em;padding-top:1.6em}
.guest p{font-family:var(--serif);font-size:var(--f-base);color:var(--ink-soft)}

/* share + edition navigation */
.share{display:flex;justify-content:center;padding:var(--s1) 0 0}
.share button{display:inline-flex;align-items:center;gap:12px;background:none;border:0;cursor:pointer;font:inherit;font-size:var(--f-label);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-ink);padding:12px 6px}
.share .sep{width:1px;height:16px;background:var(--line)}
.share svg{width:15px;height:15px;fill:currentColor;opacity:.75}
.share .g{display:inline-flex;gap:2px;align-items:center}
.share .g a{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px}
@media (any-hover:hover) and (any-pointer:fine){.share button:hover{color:var(--green)}}
.dl{text-align:center;margin-top:6px}
.dl a{font-family:var(--sans);font-size:var(--f-label);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute);text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:3px}
@media (any-hover:hover) and (any-pointer:fine){.dl a:hover{color:var(--gold-ink);border-color:var(--gold-ink)}}
.more{max-width:812px;margin:var(--s2) auto 0;padding:0 var(--pad) var(--s3);display:grid;grid-template-columns:1fr 1fr;gap:18px}
.more a{display:block;text-decoration:none;border-top:1px solid var(--line);padding-top:16px}
.more a.next{grid-column:2;text-align:right}
.more .d{display:block;font-size:var(--f-label);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute)}
.more .t{display:block;font-family:var(--serif);font-weight:600;font-size:var(--f-base);line-height:1.3;color:var(--green);margin-top:6px}
@media (any-hover:hover) and (any-pointer:fine){.more a:hover .t{color:var(--gold-ink)}}
@media (max-width:560px){.more{grid-template-columns:1fr}.more a.next{grid-column:auto;text-align:left}}

/* a LinkedIn glyph beside a name */
.li{position:relative;top:-.1em;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-left:8px;vertical-align:middle;color:var(--gold);border:1px solid var(--green-line);border-radius:50%}
.li::after{content:"";position:absolute;inset:-11px}
.li svg{width:11px;height:11px;fill:currentColor}
.about .li{color:var(--gold-ink);border-color:var(--line)}
.li-foot{display:inline-flex;align-items:center;justify-content:center;min-width:44px;color:var(--on-green-soft)}
.li-foot svg{width:14px;height:14px;fill:currentColor}
.foot .fl{display:flex;align-items:center;gap:22px}
@media (any-hover:hover) and (any-pointer:fine){.li:hover{color:var(--white);border-color:var(--gold)}.about .li:hover{color:var(--green)}.li-foot:hover{color:var(--on-green)}}

/* the about page */
.about{padding-block:var(--s2)}
.about p{font-family:var(--serif);font-size:var(--f-body);line-height:1.65;color:var(--ink);max-width:62ch}
.about p+p{margin-top:1em}
.about .media{margin-top:var(--s2);padding-top:var(--s1);border-top:1px solid var(--line)}
.about .media .lab{margin-bottom:8px;padding-bottom:6px}
.about .media ul{list-style:none}
.about .media li{font-family:var(--serif);font-size:var(--f-base);line-height:1.45;padding:5px 0 5px 16px;position:relative}
.about .media li::before{content:"";position:absolute;left:1px;top:.78em;width:5px;height:5px;background:var(--gold-ink);transform:rotate(45deg)}
.about .media a{color:var(--gold-ink);text-decoration:none;border-bottom:1px solid rgba(125,98,32,.35)}
.founder{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(20px,3vw,34px);align-items:start}
.founder h2{font-family:var(--serif);font-weight:600;font-size:var(--f-h2);line-height:1.15;color:var(--green);display:flex;align-items:center;flex-wrap:wrap}
.founder .role{font-family:var(--serif);font-style:italic;font-size:var(--f-base);color:var(--gold-ink);margin:4px 0 12px}
.about .face-lg{--ring-gap:#FFFFFF;--ring-2:rgba(125,98,32,.34)}
@media (max-width:620px){.founder{grid-template-columns:1fr}.founder .fig{width:150px}}

/* plain pages */
.plain{max-width:760px;margin:0 auto;padding:var(--s3) var(--pad)}
.plain h1{font-family:var(--serif);font-weight:600;font-size:var(--f-h1);line-height:1.1;color:var(--green);text-wrap:balance}
.plain p{font-family:var(--serif);font-size:var(--f-body);line-height:1.65;color:var(--ink-soft);margin-top:1em;max-width:62ch}
.plain p a{color:var(--gold-ink)}

/* footer */
.foot{background:var(--green);color:var(--on-green-soft);font-size:var(--f-small)}
.foot .wrap{display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:space-between;align-items:center;padding-block:var(--s1)}
.foot a{color:var(--on-green-soft);text-decoration:none}
@media (any-hover:hover) and (any-pointer:fine){.foot a:hover{color:var(--on-green)}}

/* phones: thumbs need 44px, and small capitals need a size they can be read at */
@media (max-width:620px){
  :root{--f-label:.74rem;--f-small:.9rem}
  .links{gap:18px}
  .right .cta{padding:12px 16px}
  .logo{padding:8px 0}
  .hero .go,.dl a,.feat .go,.more a .t{display:inline-block;padding-top:10px;padding-bottom:10px}
  .btn{width:100%;justify-self:stretch;padding:16px 20px}
  .sub-form{grid-template-columns:1fr;gap:14px}
  .sub-form .btn,.sub-form .li-btn,.sub-form .also{grid-column:1}
  .foot .wrap{padding-block:var(--s2)}
  .foot a{display:inline-block;padding:10px 4px}
  .share button{padding:14px 6px}
  .ed h3 a{display:inline-block;padding:2px 0}
  .form select{padding:12px 0}
  .more a{padding-top:14px;padding-bottom:6px}
  .plain p a,.panel .fine a{display:inline-block;padding:10px 0}
}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

@media print{
  .nav,.weave,.weave-rule,.panel,.foot,.share,.dl,.more,.skip,.li{display:none!important}
  html,body{background:#fff;color:#000;font-size:11pt}
  .ehead{background:#fff;color:#000;padding:0 0 12pt}
  .ehead h1,.ehead .kicker,.ehead .by,.ehead .stand{color:#000}
  .body{max-width:none;padding:0}
  .body h2,.body h3,.body blockquote{color:#000;page-break-after:avoid}
  .ask{background:#fff;color:#000;border:1pt solid #000}
  .ask h2,.ask h3,.ask li,.ask p,.ask li b{color:#000}
  .body blockquote{border-left:2pt solid #000}
  p,li,blockquote{page-break-inside:avoid}
}
