/* Fieldwork Studio: precision type, graphite surfaces, and practical examples. */
:root {
  color-scheme: dark;
  --paper:#111318; --ink:#f5f3ee; --muted:#b0b5c2; --line:#333742;
  --navy:#161922; --blue:#bac4ff; --orange:#ffad76; --ice:#222739;
  --surface:#1a1d25; --raised:#222630; --mono:'IBM Plex Mono',Consolas,monospace;
}
body{background:var(--paper);color:var(--ink)}
.wrap{max-width:1360px}
h1,h2,h3{font-weight:600;letter-spacing:-.054em}
.review{background:#222630;border-bottom:1px solid #373c49;color:#e9eaf3}
.review button{border-color:#656d85;border-radius:3px}
header{background:#111318;border-bottom:1px solid var(--line)}
.nav{min-height:82px;gap:26px}
.brand{font-size:19px;letter-spacing:-.03em;gap:11px;line-height:1}
.brandmark{display:grid;place-items:center;clip-path:none;background:#bac4ff;color:#15172a;border-radius:4px;width:35px;height:35px;padding:0}
.brandmark svg{width:23px;height:23px}
.brand small{display:block;font:10px/1.4 var(--mono);color:var(--muted);letter-spacing:.04em;margin-top:4px}
.navlink{color:#bdc1cc}.navlink:hover{color:#fff}.navlink.active{color:var(--blue)}
.btn{border-radius:4px;background:var(--blue);color:#171b2d;padding:12px 17px}
.btn:hover{background:#d2d9ff;color:#171b2d}.btn.secondary{border-color:#51596c;color:var(--ink)}
.btn.secondary:hover{border-color:#a3b1ec;background:#272c3b;color:white}.btn.light{background:#eeeefe;color:#1a2233}
.btn.light:hover{background:white}.btn .arrow{font-family:var(--mono);font-size:17px}
.intro,.crumb,.footprint-label{font-family:var(--mono);font-size:11px;letter-spacing:.025em}
.dot{background:var(--orange)}
.hero-stage{position:relative;isolation:isolate;overflow:hidden;border-bottom:1px solid #383d4a;background:#14171e}
.hero-stage::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#14171e 17%,#14171e31 88%),repeating-linear-gradient(0deg,#b1c4fa15 0 1px,transparent 1px 36px),repeating-linear-gradient(90deg,#b1c4fa15 0 1px,transparent 1px 36px);mask-image:linear-gradient(#000,#000 70%,transparent)}
.hero{grid-template-columns:1.06fr 1fr;gap:48px;padding-top:79px;padding-bottom:72px}
.hero h1{font-size:clamp(54px,6.2vw,93px);line-height:.99;letter-spacing:-.072em;max-width:690px}
.hero .intro{margin-bottom:23px;color:#d1d7f7}.hero .lede{max-width:46ch;margin-top:25px;color:#c3c7d3;font-size:17px}.hero .actions{margin-top:27px}
.hero .smallnote{font:11px/1.65 var(--mono);color:#a8afc1;margin-top:21px}
.lab-console{min-width:0;background:#161921;border:1px solid #525b74;border-radius:10px;box-shadow:0 16px 56px #090a1170;overflow:hidden}
.console-top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 17px;border-bottom:1px solid #404656;color:#bec6dd;font:11px/1.45 var(--mono);background:#202430}
.console-status{display:inline-flex;align-items:center;gap:7px;color:#e6c3a7;white-space:nowrap}.console-status::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--orange)}
.console-content{padding:18px 19px 20px}.console-switch{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}
.console-switch button{background:#242836;border:1px solid #42485a;color:#c8cde0;border-radius:3px;padding:7px 5px;font-size:12px;line-height:1.35;min-width:0}
.console-switch button[aria-pressed=true]{color:#161a2b;background:var(--blue);border-color:var(--blue);font-weight:700}
.console-brief{padding:20px 0 15px}.console-brief h2{font-size:clamp(24px,2.5vw,33px);letter-spacing:-.045em;line-height:1.05}.console-brief p{margin-top:8px;font-size:13px;color:#b6bdce;min-height:42px}
.console-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-bottom:15px}
.console-step{min-width:0;padding:10px 9px;background:#222634;border:1px solid #444b61;border-radius:4px;overflow-wrap:anywhere}
.console-step span{display:block;font:10px/1.35 var(--mono);color:#c3ccff;margin-bottom:7px}
.console-step b{display:block;color:#f2f2f7;font-size:12px;line-height:1.4;font-weight:600}
.console-output{display:flex;gap:10px;align-items:baseline;padding:10px 11px;background:#242823;border-left:2px solid #d0bc83;color:#f3e8c8;font-size:12px;line-height:1.45}
.console-output span:first-child{font:10px/1.4 var(--mono);color:#e2c780;white-space:nowrap}
.console-link{margin-top:13px;font-size:13px}
.client-section{color-scheme:light;color:#222837;background:#f6f6f3;border-color:#d6d7db;--line:#d8dbe2;--blue:#334277;--muted:#465061}
.client-head h2{font-size:23px;letter-spacing:-.037em}.client-controls button{background:#f6f6f3;border-color:#bfc4d1}.client-controls button:hover{background:#e8eafa}.client-tile{border-inline-color:#e2e3e5}.client-oman-moe img{background:#161b2b}
.formatline{background:#171a21;border-color:var(--line)}.formatline .wrap{gap:14px;font-size:13px}.formatline a:hover span{color:var(--blue)}
.sectionhead p,.proof p,.leaderrole p,.format p,.agendarow p,.workshop p{color:var(--muted)}
.paths{border-color:#444a5a}.path{border-color:#383e4b}.pathicon{color:#c8d0ff;background:#292e41;border-radius:4px;font-family:var(--mono)}
.tag{background:#262a37;color:#ccd1e2;border:1px solid #3d4355;border-radius:3px}
.executive{background:#242a3d;border:1px solid #4e5a7c;border-radius:8px;position:relative}.execmini{border-color:#586481}.execmini div{border-color:#495574}.execmini b{color:#d0d7ff}.executive p{color:#c5cbe0}
.stepnum{color:#adbafa;font-family:var(--mono);font-size:24px}.proofsteps h3{letter-spacing:-.035em}
.community{background:#242938;border-color:#464e66}.community p{color:#bec5d8}
.lab-section{background:#eae9e3;color:#25283a;padding:65px 0;border-block:1px solid #cbcad0}
.lab-section .sectionhead p{color:#4b5060}.lab-kicker{font:11px/1.45 var(--mono);color:#535e86;margin-bottom:13px}
.lab-examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.lab-example{padding:21px 20px;border:1px solid #c2c5cf;background:#f4f3ef;display:flex;flex-direction:column;min-width:0;min-height:228px}
.lab-example .lab-kicker{display:flex;justify-content:space-between;gap:10px;padding-bottom:12px;margin-bottom:16px;border-bottom:1px solid #cfd1d8}
.lab-example h3{font-size:25px;margin-bottom:11px}.lab-example p{font-size:14px;color:#4b5060;margin-bottom:15px}
.lab-example a{margin-top:auto;color:#354276;font-size:13px;font-weight:700;text-decoration:underline;text-underline-offset:4px}
.blog-placeholder{border-color:var(--line)}.blog-empty{background:#1c202a;border-color:#56617c;color:#ced3e4;border-radius:4px}
.footprint{background:#191d28;border-top:1px solid #434a60}.footprint-label,.world-region h3{color:#c1cbff}
.world-frame{background:#171b26;border-color:#4b536b;border-radius:6px}.map-grid{stroke:#424b65}.map-land{fill:#3b445d;stroke:#191e2b}.map-highlight{fill:#bac4ff;stroke:#232944}.map-dots{fill:#ffad76;stroke:#191d28}.world-frame figcaption{border-color:#4b536b;color:#c5cbe0}.world-frame figcaption i{background:#bac4ff}.world-region ul{color:#d5d9e4}
footer{background:#101218;border-top:1px solid #353a4a}footer .wrap{color:#b5baca}
.pageintro{padding-top:56px;padding-bottom:36px}.pageintro h1,.coursehero h1{font-size:clamp(43px,5.6vw,78px);line-height:1.04}.crumb{color:#b9c3e3}
.filter{border-radius:4px;color:#ced1db;border-color:#565f76}.filter:hover{background:#252a38}.filter.active{color:#15182b;background:var(--blue)}
.catalogue{gap:13px}.course{min-height:239px;border-radius:5px;background:var(--surface);border-color:#404657;border-top:2px solid #626e9d}.course:hover{border-color:#a3afe3}.course .audience{font:11px/1.45 var(--mono);color:#c8d0f5}.course h3{font-size:25px}.course p{color:#b6bccd}.proposed{background:#242b3b;color:#d0d6e9;border-color:#8998dc}
.leaderhero{position:relative;background:#23283d;border-block:1px solid #4c587a}.leaderhero .intro{color:#ced6ff}.leaderhero .lede{color:#d3d8e9}.leaderhero h1{font-size:clamp(45px,5.4vw,76px);letter-spacing:-.068em}.brief{color:#252b41;background:#f0eff1;border-radius:5px;box-shadow:9px 9px 0 #414c73;transform:rotate(0.8deg)}.briefsmall,.briefrow small{color:#535e76}.briefrow{border-color:#c8ccda}.briefrow i{color:#714529}.leaderrole,.format{border-color:#909cdb}.leaderrole ul,.format ul{color:#d1d6e6}.agenda{background:#1b1f2a;border-color:#424a60}.agendarow span,.format .formatlabel,.timeline span{font:11px/1.5 var(--mono);color:#bfcaff}
.coursepanel,.workshop,.curriculum details{background:var(--surface);border-color:#42485b;border-radius:5px}.sampleartifact{background:#252b41;border:1px solid #525e8a;border-radius:5px}.sampleartifact p{color:#ccd3ed}.sampleflow span{border-color:#707aa7}.coursepanel .detailrow,.checklist li{border-color:#3c4357}.checklist li:before{color:#bfcbff}.curriculum summary:hover{background:#232838}.curriculum details p{color:#bec3d4}.workshop{gap:35px}.timeline p{color:#c2c7d6}
.modal{background:#1d2230;color:var(--ink);border:1px solid #5e6a92;border-radius:7px}.modal p,.close{color:#ced3e5}.modalback{background:#090b13bc}
.leaderhero .btn[href="#leaders-agenda"]{color:#f5f3ee}
.wireframe{--paper:#161616;--ink:#f6f6f6;--muted:#c5c5c5;--line:#545454;--blue:#d4d4d4;--navy:#272727;--orange:#ddd}
.wireframe :is(header,main,footer,.modal){filter:grayscale(1)}
@media(min-width:1500px){.wrap{max-width:1450px}.hero{gap:70px}}
@media(max-width:1050px){.hero{gap:27px;padding-top:57px;padding-bottom:49px}.hero h1{font-size:clamp(48px,6.2vw,69px)}.console-content{padding:15px}.console-step{padding:8px}.formatline .wrap{font-size:12px}}
@media(max-width:760px){.nav{min-height:93px;gap:5px 18px}.brand{margin-bottom:8px}.brand small{font-size:9px}.hero{gap:28px;padding-top:40px;padding-bottom:37px}.hero h1{font-size:clamp(48px,10.7vw,65px)}.hero .lede{font-size:15px}.hero .actions{margin-top:21px}.hero .smallnote{margin-top:14px}.console-content{padding:14px}.console-brief{padding-top:15px}.console-brief p{min-height:0}.console-step span{font-size:9px}.console-step b{font-size:11px}.console-output{display:block}.console-output span:first-child{margin-right:8px}.formatline .wrap{gap:9px}.sectionhead h2{max-width:20ch}.lab-section{padding:39px 0}.lab-examples{grid-template-columns:1fr;gap:13px}.lab-example{min-height:0}.lab-example h3{font-size:23px}.executive{padding:26px}.course{min-height:0}.leaderhero h1,.pageintro h1,.coursehero h1{font-size:clamp(40px,9.1vw,55px)}.leaderhero .lede{font-size:15px}.brief{padding:24px}.briefrow{padding:12px 0}.world-regions{gap:17px}.navlink{font-size:12px}}
@media(max-width:350px){.console-switch button{font-size:10px}.console-top{padding:12px;font-size:10px}.console-step{padding:7px 5px}.hero h1{font-size:43px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}}
