:root{
  --ink:#182019;
  --forest:#22382b;
  --forest-deep:#14271d;
  --forest-light:#4c6552;
  --cream:#f1ebdd;
  --paper:#faf8f1;
  --clay:#a35431;
  --clay-light:#ca8b65;
  --gold:#c2a063;
  --muted:#666f68;
  --line:#d9d3c6;
  --terminal:#0f1712;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:
    linear-gradient(rgba(91,78,52,.025) 1px,transparent 1px),
    var(--paper);
  background-size:100% 32px;
  color:var(--ink);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.62;
}
a{color:inherit}
::selection{background:#d6c1a3;color:var(--ink)}

.top-strip{
  background:var(--forest-deep);
  color:#aebdb2;
  font:500 .69rem/1 "IBM Plex Mono",monospace;
  letter-spacing:.09em;
  display:flex;
  justify-content:space-between;
  padding:10px max(28px,calc((100vw - 1144px)/2));
  border-bottom:1px solid rgba(255,255,255,.08);
}
.top-strip-right{color:#788d7d}

.site-header{
  height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  max-width:1200px;
  margin:auto;
  padding:0 28px;
}
.brand{
  text-decoration:none;
  font-weight:800;
  letter-spacing:-.06em;
  font-size:1.22rem;
  border:2px solid var(--ink);
  width:44px;height:44px;
  display:grid;place-items:center;
  border-radius:50%;
  position:relative;
}
.brand:after{
  content:"";
  width:5px;height:5px;
  border-radius:50%;
  position:absolute;
  right:-5px;top:2px;
  background:var(--clay);
  box-shadow:0 0 0 3px var(--paper);
}
.nav{display:flex;gap:25px}
.nav a{
  text-decoration:none;
  font-size:.84rem;
  font-weight:650;
  color:#3e4942;
}
.nav a:hover{color:var(--clay)}

.hero{
  min-height:700px;
  max-width:1200px;
  margin:auto;
  padding:62px 28px 90px;
  display:grid;
  grid-template-columns:1.06fr .94fr;
  gap:58px;
  align-items:center;
}
.eyebrow{
  text-transform:uppercase;
  letter-spacing:.15em;
  font-size:.72rem;
  font-weight:800;
  color:var(--clay);
  margin:0 0 18px;
}
h1,h2,h3,p{margin-top:0}
h1{
  font-size:clamp(4.3rem,8vw,7.45rem);
  line-height:.84;
  letter-spacing:-.078em;
  margin-bottom:30px;
}
h1 span{
  font-family:"Libre Baskerville",serif;
  font-style:italic;
  font-weight:400;
  color:var(--forest);
}
.hero-line{
  font-size:1.28rem;
  font-weight:750;
  margin-bottom:15px;
}
.hero-intro{
  max-width:640px;
  font-size:1.05rem;
  color:#525c55;
}
.hero-actions,.connect-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:28px;
}
.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 22px;
  border-radius:999px;
  text-decoration:none;
  font-weight:750;
  font-size:.91rem;
  border:1px solid var(--ink);
  transition:.18s ease;
}
.button.primary{background:var(--ink);color:white}
.button.primary:hover{background:var(--forest);transform:translateY(-2px)}
.button.ghost:hover{background:var(--cream);transform:translateY(-2px)}
.terminal-line{
  margin-top:32px;
  font:500 .73rem/1.4 "IBM Plex Mono",monospace;
  color:#68736c;
}
.prompt{color:var(--clay);margin-right:8px}
.cursor{animation:blink 1.05s steps(1) infinite}
@keyframes blink{50%{opacity:0}}

.hero-art{
  min-height:525px;
  position:relative;
  overflow:hidden;
  border-radius:4px 34px 4px 34px;
  background:linear-gradient(180deg,#e8deca 0%,#d0c4ac 53%,#aab19c 100%);
  box-shadow:0 22px 60px rgba(27,37,29,.12);
  isolation:isolate;
}
.hero-art:after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(255,255,255,.12),transparent 22%,transparent 78%,rgba(31,52,38,.1));
  pointer-events:none;
  z-index:8;
}
.sun{
  width:118px;height:118px;border-radius:50%;
  background:#cfac6d;
  position:absolute;right:63px;top:55px;
  opacity:.8;
  z-index:1;
}
.network{
  position:absolute;
  inset:0;
  width:100%;height:100%;
  z-index:2;
  opacity:.48;
}
.links line{
  stroke:#35533f;
  stroke-width:1.5;
  stroke-dasharray:5 7;
}
.nodes circle{
  fill:#f4ead4;
  stroke:#35533f;
  stroke-width:2;
}
.topo{
  position:absolute;
  border:1px solid rgba(65,87,68,.16);
  border-radius:47% 53% 54% 46%;
  z-index:1;
}
.topo-one{
  width:270px;height:165px;
  top:24px;left:-65px;
  transform:rotate(17deg);
  box-shadow:
    0 0 0 15px rgba(65,87,68,.055),
    0 0 0 31px rgba(65,87,68,.04),
    0 0 0 49px rgba(65,87,68,.03);
}
.topo-two{
  width:195px;height:110px;
  right:-35px;top:215px;
  transform:rotate(-24deg);
  box-shadow:
    0 0 0 13px rgba(65,87,68,.05),
    0 0 0 28px rgba(65,87,68,.04),
    0 0 0 44px rgba(65,87,68,.025);
}
.mountain{
  position:absolute;
  width:142%;
  left:-21%;
  border-radius:50% 50% 0 0;
  z-index:3;
}
.mountain-back{
  height:45%;bottom:25%;
  background:#84927f;
  opacity:.76;
  transform:rotate(-4deg);
}
.mountain-mid{
  height:38%;bottom:9%;
  background:#536e57;
  transform:rotate(5deg);
}
.mountain-front{
  height:34%;bottom:-7%;
  background:#233f2d;
  transform:rotate(-2deg);
}
.hero-card{
  position:absolute;
  left:28px;bottom:28px;
  background:rgba(250,248,241,.9);
  backdrop-filter:blur(9px);
  padding:22px 24px;
  border-radius:3px 17px 3px 17px;
  width:min(290px,calc(100% - 56px));
  z-index:6;
  border:1px solid rgba(255,255,255,.5);
}
.card-label{
  display:block;
  font:600 .68rem/1 "IBM Plex Mono",monospace;
  text-transform:uppercase;
  letter-spacing:.11em;
  color:var(--clay);
  margin-bottom:10px;
}
.hero-card p{
  font-family:"Libre Baskerville",serif;
  font-size:1.13rem;
  line-height:1.5;
  margin:0;
}
.status-chip{
  position:absolute;
  right:18px;bottom:18px;
  z-index:7;
  background:rgba(18,34,24,.9);
  color:#d8e2da;
  font:500 .65rem/1 "IBM Plex Mono",monospace;
  letter-spacing:.08em;
  padding:10px 12px;
  display:flex;
  align-items:center;
  gap:7px;
}
.status-dot{
  width:7px;height:7px;border-radius:50%;
  background:#8bb18f;
  box-shadow:0 0 8px rgba(139,177,143,.8);
}

.statement{
  background:var(--cream);
  padding:76px 28px;
  text-align:center;
  border-top:1px solid #e6dece;
  border-bottom:1px solid #e1d8c6;
}
.statement p{
  max-width:940px;
  margin:auto;
  font-family:"Libre Baskerville",serif;
  font-size:clamp(1.45rem,2.8vw,2.35rem);
  line-height:1.45;
}
.statement strong{
  font-weight:400;
  color:var(--clay);
}

.section{
  max-width:1200px;
  margin:auto;
  padding:100px 28px;
}
.two-col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:78px;
}
h2{
  font-size:clamp(2.2rem,4vw,4rem);
  line-height:1.05;
  letter-spacing:-.05em;
}
.body-copy{
  font-size:1.04rem;
  color:#505a53;
}
.local-note{
  margin-top:32px;
  padding:19px 0 0;
  border-top:1px solid var(--line);
  display:grid;
  grid-template-columns:90px 1fr;
  gap:16px;
  align-items:start;
}
.local-note span{
  color:var(--clay);
  font:600 .75rem/1.4 "IBM Plex Mono",monospace;
}
.local-note p{
  margin:0;
  font-size:.87rem;
  color:#747b75;
}

.dark{
  max-width:none;
  background:var(--forest-deep);
  color:white;
  position:relative;
  overflow:hidden;
}
.tech-grid{
  position:absolute;inset:0;
  opacity:.25;
  background-image:
    linear-gradient(rgba(123,159,131,.13) 1px,transparent 1px),
    linear-gradient(90deg,rgba(123,159,131,.13) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.85),transparent 92%);
}
.tech-grid:after{
  content:"";
  position:absolute;
  width:320px;height:320px;
  border:1px solid rgba(154,190,162,.22);
  border-radius:50%;
  right:7%;top:8%;
  box-shadow:
    0 0 0 45px rgba(154,190,162,.035),
    0 0 0 88px rgba(154,190,162,.025),
    0 0 0 130px rgba(154,190,162,.015);
}
.section-inner{
  max-width:1144px;
  margin:auto;
  position:relative;
  z-index:1;
}
.light{color:#d69d7c}
.heading-copy{
  max-width:620px;
  color:#b9c6bc;
  font-size:1rem;
}
.cards{
  margin-top:54px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.card{
  min-height:305px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.11);
  border-radius:4px 20px 4px 20px;
  padding:26px;
}
.card .number{
  display:block;
  font:500 .67rem/1 "IBM Plex Mono",monospace;
  color:#8aa092;
  margin-bottom:35px;
}
.card-icon{
  width:40px;height:40px;
  display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.17);
  color:#d5b495;
  font:500 1rem/1 "IBM Plex Mono",monospace;
  margin-bottom:22px;
}
.card h3{font-size:1.28rem;margin-bottom:12px}
.card p{color:#cad4cc;margin:0;font-size:.94rem}

.split-heading{
  display:grid;
  grid-template-columns:1.4fr .6fr;
  gap:60px;
  align-items:end;
}
.heading-side{
  color:#697169;
  margin-bottom:9px;
}
.interest-grid{
  margin-top:50px;
  border-top:1px solid var(--line);
}
.interest{
  display:grid;
  grid-template-columns:58px 1fr 1.35fr 1fr;
  gap:25px;
  padding:29px 0;
  border-bottom:1px solid var(--line);
  align-items:start;
}
.interest > span{
  color:var(--clay);
  font:600 .73rem/1.6 "IBM Plex Mono",monospace;
}
.interest h3{
  font-size:1.08rem;
  margin:0;
}
.interest p{
  color:#59625c;
  margin:0;
}
.interest code{
  color:#758178;
  font:500 .68rem/1.5 "IBM Plex Mono",monospace;
  background:#f0ece2;
  padding:8px 10px;
  white-space:normal;
}

.story{padding-top:20px}
.story-box{
  background:
    linear-gradient(90deg,rgba(164,83,49,.04) 1px,transparent 1px),
    linear-gradient(rgba(164,83,49,.04) 1px,transparent 1px),
    var(--cream);
  background-size:28px 28px;
  border-radius:4px 30px 4px 30px;
  padding:clamp(38px,7vw,82px);
  display:grid;
  grid-template-columns:150px 1fr;
  gap:50px;
  overflow:hidden;
}
.story-map{
  position:relative;
  min-height:400px;
}
.story-line{
  width:2px;
  background:linear-gradient(var(--clay),var(--forest));
  position:absolute;
  top:7px;bottom:7px;left:50%;
  transform:translateX(-50%);
}
.story-point{
  position:absolute;
  width:14px;height:14px;
  border-radius:50%;
  background:var(--paper);
  border:3px solid var(--clay);
  left:50%;
  transform:translateX(-50%);
  box-shadow:0 0 0 5px rgba(164,83,49,.09);
}
.p1{top:3%}.p2{top:25%}.p3{top:48%}.p4{top:71%}.p5{top:94%}
.story-lead{
  font-family:"Libre Baskerville",serif;
  font-size:1.35rem;
  color:var(--forest);
}
.story-content > p:not(.eyebrow):not(.story-lead){
  max-width:800px;
  color:#505a52;
}
.journey{
  margin-top:34px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:9px;
  font:600 .66rem/1.4 "IBM Plex Mono",monospace;
  color:#4d5e51;
}
.journey span{
  padding:7px 9px;
  border:1px solid #cfc4ae;
  background:rgba(255,255,255,.35);
}
.journey i{font-style:normal;color:var(--clay)}

.porch{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:70px;
  align-items:center;
}
.porch-copy > p:last-child{
  max-width:650px;
  color:#59625c;
}
.porch-terminal{
  background:var(--terminal);
  border:1px solid #2b3d30;
  box-shadow:0 20px 50px rgba(18,31,22,.17);
  color:#b7c7ba;
  font-family:"IBM Plex Mono",monospace;
  border-radius:7px;
  overflow:hidden;
}
.terminal-head{
  height:39px;
  background:#1b261e;
  display:flex;
  align-items:center;
  gap:7px;
  padding:0 13px;
  border-bottom:1px solid #2a392e;
}
.terminal-head span{
  width:8px;height:8px;border-radius:50%;
  background:#68766a;
}
.terminal-head b{
  margin-left:9px;
  font-size:.66rem;
  font-weight:500;
  color:#7e9282;
}
.porch-terminal pre{
  margin:0;
  padding:26px;
  font:500 .77rem/1.85 "IBM Plex Mono",monospace;
  overflow:auto;
}
.green{color:#8bb18f}

.connect{text-align:center;padding-bottom:115px}
.connect > p:not(.eyebrow):not(.edit-note){
  max-width:720px;
  margin:0 auto;
  color:#5b645e;
  font-size:1.04rem;
}
.connect-actions{justify-content:center}
.edit-note{
  margin-top:23px;
  font-size:.71rem;
  color:#969b97;
}

footer{
  border-top:1px solid var(--line);
  max-width:1200px;
  margin:auto;
  padding:30px 28px 45px;
  display:flex;
  justify-content:space-between;
  color:#737a75;
  font-size:.78rem;
}
.footer-tech{
  font:500 .66rem/1.4 "IBM Plex Mono",monospace;
  letter-spacing:.07em;
}

@media(max-width:900px){
  .top-strip-right{display:none}
  .nav{display:none}
  .hero{grid-template-columns:1fr;padding-top:38px}
  .hero-art{min-height:465px}
  .two-col,.porch{grid-template-columns:1fr;gap:34px}
  .cards{grid-template-columns:1fr}
  .split-heading{grid-template-columns:1fr;gap:16px}
  .interest{grid-template-columns:44px 1fr}
  .interest p,.interest code{grid-column:2}
  .story-box{grid-template-columns:1fr}
  .story-map{display:none}
}

@media(max-width:600px){
  .top-strip{padding-left:20px;padding-right:20px}
  .site-header{padding:0 20px}
  .hero,.section{padding-left:20px;padding-right:20px}
  h1{font-size:clamp(3.7rem,20vw,5.2rem)}
  .hero-art{min-height:420px}
  .hero-card{left:18px;bottom:18px}
  .status-chip{display:none}
  .statement{padding:58px 20px}
  .story-box{padding:34px 24px}
  footer{padding-left:20px;padding-right:20px;flex-direction:column;gap:8px}
}