@font-face { font-family:"DM Mono"; font-style:normal; font-weight:400; font-display:swap; src:url("assets/fonts/dm-mono-400.woff2") format("woff2"); }
@font-face { font-family:"DM Mono"; font-style:normal; font-weight:500; font-display:swap; src:url("assets/fonts/dm-mono-500.woff2") format("woff2"); }
@font-face { font-family:"Manrope"; font-style:normal; font-weight:400 800; font-display:swap; src:url("assets/fonts/manrope-latin.woff2") format("woff2"); }
@font-face { font-family:"Playfair Display"; font-style:normal; font-weight:400 900; font-display:swap; src:url("assets/fonts/playfair-display-latin.woff2") format("woff2"); }
@font-face { font-family:"Playfair Display"; font-style:italic; font-weight:500; font-display:swap; src:url("assets/fonts/playfair-display-italic-latin.woff2") format("woff2"); }
:root { --ink:#161616; --graphite:#20201e; --soft:#e5e1d9; --paper:#f1eee7; --copper:#ba6838; --sand:#c8bdab; --line:rgba(22,22,22,.17); --white:#fffdf8; --shell:min(1180px, calc(100vw - 72px)); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Manrope,Arial,sans-serif; font-size:16px; line-height:1.6; }
a { color:inherit; text-decoration:none; }
.page-shell { width:var(--shell); margin:0 auto; }
.site-header { position:absolute; z-index:10; top:0; left:0; right:0; width:var(--shell); margin:auto; padding:26px 0; color:var(--white); display:flex; align-items:center; justify-content:space-between; }
.brand { display:inline-flex; gap:10px; align-items:center; font:600 17px/1 "DM Mono",monospace; letter-spacing:.12em; }
.brand-mark { width:29px; height:29px; display:block; object-fit:contain; }
.site-nav { display:flex; gap:30px; align-items:center; font:500 11px/1 "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; }
.site-nav a { opacity:.85; transition:opacity .2s ease; }.site-nav a:hover,.site-nav a:focus-visible { opacity:1; }
.menu-toggle { display:none; border:0; background:transparent; color:inherit; padding:7px 0; }.menu-toggle span { display:block; width:24px; height:1px; background:currentColor; margin:6px 0; }
.hero { position:relative; min-height:760px; height:100svh; color:var(--white); overflow:hidden; display:flex; align-items:center; }
.hero-media { position:absolute; inset:0; background:url("assets/oilfield-dawn.jpg") 50% 58% / cover no-repeat; transform:scale(1.02); animation:hero-settle 1.5s ease-out both; }
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(11,12,14,.80) 0%,rgba(11,12,14,.44) 48%,rgba(11,12,14,.14) 100%); }
.hero-copy { position:relative; z-index:1; padding-top:70px; max-width:1180px; }
.section-index,.overline { margin:0 0 24px; font:500 10px/1.2 "DM Mono",monospace; text-transform:uppercase; letter-spacing:.15em; color:#827b70; }.light { color:rgba(255,253,248,.73); }
h1,h2,h3,p { margin-top:0; }h1,h2 { font-family:"Playfair Display",Georgia,serif; font-weight:500; letter-spacing:0; }h1 { max-width:720px; margin-bottom:24px; font-size:clamp(56px,7.8vw,112px); line-height:.94; }h1 em,h2 em { font-weight:500; color:var(--copper); }
.hero-intro { max-width:490px; margin:0 0 34px; color:rgba(255,253,248,.84); font-size:17px; line-height:1.7; }
.hero-actions { display:flex; gap:28px; align-items:center; flex-wrap:wrap; }.button { display:inline-flex; align-items:center; justify-content:center; gap:18px; min-height:49px; padding:0 20px; font:600 11px/1 "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; transition:background .2s,color .2s,border .2s; }.button-primary { background:var(--copper); color:#fff; }.button-primary:hover { background:#d17844; }.button-dark { background:var(--ink); color:var(--white); margin-top:14px; }.button-dark:hover { background:var(--copper); }.button-outline { border:1px solid rgba(255,253,248,.55); color:var(--white); }.button-outline:hover { background:var(--white); color:var(--ink); }.text-link { display:inline-flex; align-items:center; gap:10px; border-bottom:1px solid currentColor; padding-bottom:5px; font:600 11px/1 "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; }.light-link { color:var(--white); }.dark-link { color:var(--ink); margin-top:35px; }
.hero-bottom { position:absolute; z-index:1; bottom:26px; left:0; right:0; display:flex; justify-content:space-between; color:rgba(255,253,248,.7); font:400 9px/1 "DM Mono",monospace; letter-spacing:.1em; text-transform:uppercase; }
.section { padding:148px 0; }.purpose { display:grid; grid-template-columns:190px 1fr; gap:40px; }.section-rail { display:flex; gap:16px; align-items:flex-start; font:500 10px/1.4 "DM Mono",monospace; letter-spacing:.12em; text-transform:uppercase; color:#827b70; }.section-rail span:first-child { color:var(--copper); }.purpose-content { max-width:880px; }.purpose h2,.principles h2,.field-copy h2,.paper-invitation h2 { font-size:clamp(40px,5vw,72px); line-height:1.03; margin:0 0 50px; }.body-columns { display:grid; grid-template-columns:1fr 1fr; gap:54px; max-width:780px; }.body-columns p,.field-copy p { margin:0; font-size:16px; line-height:1.8; color:#45423d; }
.principles { background:var(--graphite); color:var(--white); }.section-heading { display:grid; grid-template-columns:190px 1fr; gap:40px; }.principles .section-rail { color:#938d83; }.principles h2 { margin-bottom:84px; }.principle-list { margin-left:230px; border-top:1px solid rgba(255,253,248,.22); }.principle-item { display:grid; grid-template-columns:110px 1fr; gap:28px; border-bottom:1px solid rgba(255,253,248,.22); padding:29px 0 32px; }.principle-number { color:var(--copper); font:500 18px/1 "Playfair Display",serif; }.principle-item h3 { margin:0 0 8px; font:500 28px/1.2 "Playfair Display",serif; }.principle-item p { max-width:510px; margin:0; color:#cfc9bf; font-size:14px; }
.field-notes { display:grid; grid-template-columns:minmax(290px,.86fr) 1fr; gap:clamp(40px,10vw,145px); align-items:center; }.field-image-wrap { height:640px; overflow:hidden; background:var(--ink); }.field-image-wrap img { height:100%; width:100%; display:block; object-fit:cover; object-position:center; transition:transform .8s ease; }.field-image-wrap:hover img { transform:scale(1.04); }.field-copy { max-width:520px; }.field-copy h2 { margin-bottom:28px; }.field-copy p { margin-bottom:18px; }
.paper-invitation { background:#9c512d; color:var(--white); padding:125px 0; }.paper-inner { display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:end; }.paper-invitation h2 { margin:0; color:#fff; }.paper-invitation .section-index { color:#f2d6c3; }.paper-cta { max-width:420px; }.paper-cta p { color:#fee9d8; margin-bottom:30px; font-size:16px; line-height:1.8; }.site-footer { background:#111; color:#fff; padding:28px 0; }.footer-inner { display:flex; align-items:center; justify-content:space-between; gap:25px; }.footer-inner p { margin:0; color:#aaa59d; font:400 10px/1 "DM Mono",monospace; text-transform:uppercase; letter-spacing:.1em; }
/* Whitepaper */
.paper-page { background:#eeebe4; }.paper-header { position:sticky; top:0; z-index:10; background:rgba(238,235,228,.93); backdrop-filter:blur(12px); color:var(--ink); border-bottom:1px solid var(--line); }.paper-header .site-header { position:relative; color:var(--ink); padding:17px 0; }.paper-header .site-nav { font-size:10px; }.paper-hero { background:var(--graphite); color:var(--white); padding:150px 0 90px; }.paper-hero-grid { display:grid; grid-template-columns:190px 1fr; gap:40px; }.paper-hero .section-index { color:#bbb3a7; }.paper-hero h1 { font-size:clamp(52px,7vw,100px); max-width:820px; margin-bottom:36px; }.paper-summary { max-width:650px; color:#d8d2c9; font-size:18px; line-height:1.75; }.paper-meta { border-top:1px solid rgba(255,253,248,.26); margin-top:75px; padding-top:17px; display:flex; justify-content:space-between; gap:20px; color:#bcb4a9; font:400 10px/1.4 "DM Mono",monospace; letter-spacing:.08em; text-transform:uppercase; }
.paper-layout { width:var(--shell); margin:0 auto; display:grid; grid-template-columns:250px minmax(0,720px); gap:clamp(50px,10vw,155px); padding:92px 0 150px; }.paper-toc { align-self:start; position:sticky; top:88px; padding-top:4px; }.paper-toc p { margin:0 0 16px; color:#81796e; font:500 10px/1 "DM Mono",monospace; letter-spacing:.12em; text-transform:uppercase; }.paper-toc a { display:block; padding:7px 0; border-bottom:1px solid var(--line); color:#605b54; font-size:12px; line-height:1.35; }.paper-toc a:hover,.paper-toc a.active { color:var(--copper); }.paper-content { min-width:0; }.paper-content section { scroll-margin-top:90px; padding:0 0 72px; }.chapter-kicker { margin:0 0 15px; color:var(--copper); font:500 10px/1 "DM Mono",monospace; letter-spacing:.13em; text-transform:uppercase; }.paper-content h2 { font-size:clamp(34px,4vw,52px); line-height:1.05; margin:0 0 26px; }.paper-content h3 { margin:38px 0 13px; color:#272521; font:600 19px/1.3 Manrope,Arial,sans-serif; }.paper-content p { margin:0 0 19px; color:#45413b; font-size:16px; line-height:1.83; }.paper-content strong { color:#201e1a; }.paper-pullquote { border-top:1px solid #a6512d; border-bottom:1px solid #a6512d; margin:48px 0; padding:26px 0; color:#9c512d; font:500 clamp(27px,3.2vw,42px)/1.18 "Playfair Display",serif; }.paper-list { margin:24px 0 26px; padding:0; list-style:none; }.paper-list li { padding:12px 0 12px 28px; position:relative; border-bottom:1px solid var(--line); color:#45413b; font-size:15px; line-height:1.7; }.paper-list li::before { content:"/"; position:absolute; left:4px; color:var(--copper); font:600 17px/1.5 "DM Mono",monospace; }
.reading-meter { position:fixed; top:0; left:0; z-index:20; height:3px; width:0; background:var(--copper); transition:width .1s linear; }
@keyframes hero-settle { from { transform:scale(1.08); } to { transform:scale(1.02); } }
@media (max-width:760px) { :root { --shell:min(100% - 40px, 1180px); }.site-header { padding:19px 0; }.site-nav { display:none; position:absolute; top:67px; left:-20px; right:-20px; padding:22px 20px; background:#191918; color:#fff; flex-direction:column; align-items:flex-start; gap:18px; }.site-nav.is-open { display:flex; }.menu-toggle { display:block; }.hero { min-height:720px; }.hero-media { background-position:58% 58%; }.hero-shade { background:linear-gradient(90deg,rgba(11,12,14,.79),rgba(11,12,14,.28)); }.hero-copy { padding-top:65px; }.hero-bottom { display:none; }h1 { font-size:clamp(48px,10vw,64px); }.hero h1 em { font-size:.9em; }.hero-intro { font-size:15px; }.section { padding:86px 0; }.purpose,.section-heading,.paper-hero-grid { display:block; }.section-rail { margin-bottom:42px; }.purpose h2,.principles h2,.field-copy h2,.paper-invitation h2 { margin-bottom:30px; }.body-columns { display:block; }.body-columns p { margin-bottom:18px; }.principle-list { margin-left:0; }.principle-item { grid-template-columns:52px 1fr; gap:15px; }.principle-item h3 { font-size:25px; }.field-notes { grid-template-columns:1fr; gap:46px; }.field-image-wrap { height:480px; }.paper-inner { display:block; }.paper-cta { margin-top:35px; }.footer-inner { flex-wrap:wrap; }.paper-header .site-header { padding:15px 0; }.paper-hero { padding:105px 0 55px; }.paper-hero h1 { font-size:clamp(48px,13vw,70px); }.paper-meta { margin-top:46px; flex-direction:column; }.paper-layout { display:block; padding-top:50px; }.paper-toc { position:relative; top:auto; margin-bottom:60px; }.paper-content section { padding-bottom:58px; }.paper-content p { font-size:15px; }.paper-pullquote { font-size:29px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms!important; scroll-behavior:auto!important; transition-duration:.01ms!important; } }
