@font-face {
  font-family: 'Anton';
  src: url('../fonts/anton.ttf') format('truetype');
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root{--lime:#dcfa00;--ink:#11120d;--orange:#ff4b14;--paper:#f1f0e9;--line:rgba(17,18,13,.3);--display:'Anton',Impact,'Arial Narrow','Helvetica Neue',sans-serif;--sans:Arial,Helvetica,sans-serif;--mono:'Courier New',monospace}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;background:var(--lime);color:var(--ink);font-family:var(--sans);overflow-x:clip}
button,a{-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
button,a{touch-action:manipulation}
::selection{color:var(--lime);background:var(--ink)}
:focus-visible{outline:3px solid currentColor;outline-offset:6px}
button{cursor:pointer}
.skip{position:fixed;top:-80px;left:20px;z-index:100;background:var(--ink);color:var(--lime);padding:15px}
.skip:focus{top:12px}
.wrap{padding-inline:clamp(20px,3.2vw,64px)}
.mono{font:12px/1.5 var(--mono);text-transform:uppercase;letter-spacing:.06em}
.topbar{height:85px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--ink);gap:24px}
.logo{font-size:29px;letter-spacing:-1.7px;white-space:nowrap}
.logo strong{font-weight:900}
.logo span{font-weight:400}
.navigation{display:flex;align-items:center;gap:clamp(20px,4vw,68px);font-size:14px}
.navigation a{position:relative}
.navigation a:after{content:'';position:absolute;bottom:-6px;left:0;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .2s}
.navigation a:hover:after,.navigation a:focus-visible:after{transform:scaleX(1)}
.motion{border:0;background:none;display:flex;align-items:center;gap:9px;font:10px var(--mono);text-transform:uppercase;letter-spacing:.06em;padding:10px 0}
.motion-icon{width:18px;height:18px;border:1px solid;border-radius:50%;display:grid;place-items:center;font:10px var(--sans)}
.hero{position:relative;overflow:clip;min-height:680px;isolation:isolate;padding-top:26px;padding-bottom:36px}
.eyebrow{display:flex;justify-content:space-between;position:relative;z-index:2}
.hero-copy{position:relative;width:76%;z-index:2;margin-top:23px;pointer-events:none}
.hero h1{font-family:var(--display);font-weight:400;font-stretch:condensed;font-size:clamp(84px,14.8vw,226px);line-height:.85;letter-spacing:-.045em;margin:0;text-transform:uppercase}
.hero h1 span{display:block;width:max-content}
.hero h1 .last{position:relative}
.hero-bottom{position:relative;z-index:3;margin-top:23px;display:flex;align-items:end;justify-content:space-between;gap:30px}
.intro{font:clamp(12px,1.15vw,16px)/1.5 var(--mono);text-transform:uppercase;max-width:450px;margin:0 0 20px}
.cta{display:inline-flex;align-items:center;justify-content:space-between;gap:42px;background:var(--ink);color:var(--lime);padding:17px 22px;font-size:14px;border:1px solid var(--ink);transition:background .2s,color .2s}
.cta:hover{background:transparent;color:var(--ink)}
.arrow{display:inline-block;transition:transform .25s}
.cta:hover .arrow{transform:translate(4px,-4px)}
.scroll-note{display:flex;gap:25px;align-items:center}
.scroll-note .down{font:32px var(--sans);animation:nudge 2.5s ease-in-out infinite}
.art{position:absolute;z-index:1;right:0;top:68px;width:48%;height:78%;pointer-events:none;--dx:0px;--dy:0px}
.disc{position:absolute;width:76%;aspect-ratio:1;top:16%;left:0;background:var(--orange);border-radius:50%;transform:translate3d(var(--dx),var(--dy),0);transition:transform .15s ease-out}
.orbit{position:absolute;top:12%;left:12%;width:85%;aspect-ratio:1;border:1px solid var(--ink);border-radius:50%;transform:rotate(-24deg) scaleX(.75);animation:orbit 24s linear infinite}
.orbit:before{content:'';position:absolute;top:8%;left:15%;height:14px;width:14px;background:var(--ink);border-radius:50%}
.echo{position:absolute;right:2%;top:0;display:flex;flex-direction:column;font:clamp(38px,5.4vw,82px)/.88 var(--display);letter-spacing:-.025em;text-transform:uppercase}
.echo span{display:block;-webkit-text-stroke:1px var(--ink);color:transparent}
.echo span:nth-child(3n){color:var(--ink);-webkit-text-stroke:0}
.echo-group{margin-bottom:29px}
.coordinates{position:absolute;right:0;bottom:7%;display:grid;gap:24px;width:23%;font:10px var(--mono)}
.coordinates span{display:flex;align-items:center;gap:12px}
.coordinates span:before{content:'';height:1px;flex:1;background:var(--ink)}
.project-index{border-top:1px solid var(--ink);padding-top:17px;padding-bottom:30px}
.section-kicker{display:flex;justify-content:space-between;gap:20px}
.tiles{display:grid;grid-template-columns:repeat(4,1fr);margin-top:27px}
.tile{padding:0 20px;border-right:1px solid var(--line);display:block}
.tile:first-child{padding-left:0}
.tile:last-child{padding-right:0;border:0}
.tile-head{display:flex;gap:16px;align-items:start;margin-bottom:17px}
.tile-number{font:36px/.95 var(--mono);letter-spacing:-3px}
.tile h3{font-size:18px;line-height:1;margin:1px 0 6px;letter-spacing:-.5px}
.tile small{font:10px var(--mono);text-transform:uppercase}
.tile-art{height:112px;position:relative;overflow:hidden;background:var(--ink)}
.tile-art:after{content:'';position:absolute;right:10px;top:9px;width:22px;height:22px;color:var(--paper);background:currentColor;-webkit-mask:url('../images/arrow-up-right.svg') center/contain no-repeat;mask:url('../images/arrow-up-right.svg') center/contain no-repeat;transition:transform .25s}
.tile:hover .tile-art:after{transform:translate(3px,-3px)}
.code-art{background:repeating-linear-gradient(130deg,#171913 0 16px,#36392a 17px 18px,#10120c 19px 40px)}
.idea-art{background:var(--orange)}
.idea-art:before{content:'?';position:absolute;left:30%;top:-55px;font:210px var(--display);transform:rotate(-15deg);transition:transform .5s}
.tile:hover .idea-art:before{transform:rotate(10deg)}
.invest-art{background:var(--paper)}
.invest-art:before{content:'';position:absolute;inset:20px 30px 0;background:repeating-linear-gradient(90deg,var(--ink) 0 12%,transparent 12% 18%);clip-path:polygon(0 90%,18% 90%,18% 65%,36% 65%,36% 76%,54% 76%,54% 35%,72% 35%,72% 50%,90% 50%,90% 0,100% 0,100% 100%,0 100%)}
.invest-art:after{color:var(--ink)}
.adventure-art{background:#303627}
.adventure-art:before{content:'';position:absolute;inset:0;background:var(--paper);clip-path:polygon(0 100%,32% 10%,51% 65%,72% 0,100% 100%)}
.about{background:var(--paper);padding-block:100px}
.about-grid{display:grid;grid-template-columns:1fr 2fr;gap:60px;margin-top:55px}
.about h2{font:clamp(50px,7vw,102px)/.95 var(--display);letter-spacing:-.035em;text-transform:uppercase;margin:0;max-width:900px}
.about h2 em{font-style:normal;color:#c43b15}
.about-copy{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:35px}
.about-copy p{font-size:17px;line-height:1.65;margin:0;max-width:430px}
.seal{height:180px;width:180px;border-radius:50%;background:var(--orange);display:grid;place-items:center;font:70px var(--display);transform:rotate(-12deg);margin-top:15px}
.explore{background:var(--ink);color:var(--paper);padding-block:85px}
.explore-header{display:flex;align-items:end;justify-content:space-between;margin-bottom:40px;gap:30px}
.explore h2{font:clamp(50px,7.5vw,110px)/.9 var(--display);text-transform:uppercase;letter-spacing:-.035em;margin:25px 0 0}
.explore-header p{max-width:280px;font-size:14px;line-height:1.7;color:#b9bcb0}
.topic{border-top:1px solid #56584c;scroll-margin-top:30px}
.topic:last-child{border-bottom:1px solid #56584c}
.topic summary{list-style:none;display:flex;align-items:center;gap:35px;padding:28px 0;cursor:pointer}
.topic summary::-webkit-details-marker{display:none}
.topic .number{color:var(--lime);font:13px var(--mono)}
.topic h3{font:clamp(34px,4.5vw,64px)/1 var(--display);text-transform:uppercase;margin:0;letter-spacing:-.02em}
.topic .tag{margin-left:auto;font:11px var(--mono);text-transform:uppercase;color:#b9bcb0}
.plus{font:32px var(--sans);margin-left:15px;width:25px;transition:transform .3s}
.topic[open] .plus{transform:rotate(45deg)}
.topic[open] h3{color:var(--lime)}
.topic-body{padding:0 0 32px 51px;max-width:800px;font-size:17px;line-height:1.7}
.topic-body p{margin:0 0 15px}
.topic-body .mono{color:#b9bcb0;font-size:10px}
.topic summary:hover h3{color:var(--lime)}
.contact{position:relative;padding-block:80px 35px;overflow:hidden}
.contact h2{font:clamp(62px,12vw,180px)/.88 var(--display);letter-spacing:-.04em;text-transform:uppercase;margin:55px 0 35px;position:relative;z-index:1}
.mail{font-size:clamp(22px,4vw,55px);letter-spacing:-.04em;display:inline-flex;gap:60px;border-bottom:2px solid;padding-bottom:12px;position:relative;z-index:1}
.mail:hover .arrow{transform:translate(8px,-8px)}
.contact-disc{position:absolute;width:36vw;height:36vw;min-width:240px;min-height:240px;right:-7%;top:12%;background:var(--orange);border-radius:50%}
.footer{border-top:1px solid var(--ink);margin-top:90px;padding-top:23px;display:flex;justify-content:space-between;gap:25px;position:relative;z-index:1}
.footer a{border-bottom:1px solid}
.reveal{opacity:1;transform:none}
.js .reveal{opacity:0;transform:translateY(30px);transition:opacity .65s,transform .65s}
.js .reveal.visible{opacity:1;transform:none}
@keyframes orbit{to{transform:rotate(336deg) scaleX(.75)}
}
@keyframes nudge{50%{transform:translateY(7px)}
}

body.motion-off *,body.motion-off *:before,body.motion-off *:after{animation-play-state:paused!important;transition:none!important;scroll-behavior:auto!important}
.motion-off .disc{transform:none!important}
.motion-off .reveal{opacity:1!important;transform:none!important}

.hero h1 .development{font-size:.9em;line-height:.95}
.echo-group.development{font-size:.75em}

@media(min-width:1600px){.hero{min-height:850px}
.hero-copy{margin-top:40px}
.hero h1{font-size:250px}
}

@media(max-width:1000px){.hero{min-height:570px}
.hero h1{font-size:15vw}
.art{width:48%;top:90px;height:65%}
.hero-copy{margin-top:35px}
.echo-group{margin-bottom:20px}
.tile{padding-inline:12px}
.tile-head{gap:10px}
.tile h3{font-size:16px}
.tile-number{font-size:27px}
.about-grid{grid-template-columns:1fr 3fr;gap:30px}
.seal{width:130px;height:130px;font-size:50px}
.hero-bottom{margin-top:35px}
}

@media(max-width:650px){html{scroll-padding-top:20px}
.topbar{height:auto;min-height:100px;flex-wrap:wrap;padding-block:16px;gap:17px}
.logo{font-size:25px}
.navigation{order:3;width:100%;justify-content:space-between;font-size:13px}
.motion{font-size:9px}
.hero{padding-top:20px;min-height:580px;padding-bottom:24px}
.eyebrow{font-size:9px}
.eyebrow span:last-child{display:none}
.hero-copy{width:100%;margin-top:48px}
.hero h1{font-size:22vw;line-height:.9;letter-spacing:-.04em}
.art{top:25px;right:-40px;width:64%;height:420px;opacity:.9}
.disc{top:35%;width:88%}
.orbit{top:30%;width:100%}
.echo{display:none}
.coordinates{display:none}
.hero-bottom{margin-top:40px;display:block}
.intro{font-size:12px;max-width:280px}
.scroll-note{position:absolute;right:0;bottom:0}
.scroll-note span:first-child{display:none}
.cta{font-size:13px;padding:16px 18px;gap:40px}
.section-kicker{font-size:9px}
.section-kicker span:last-child{max-width:130px;text-align:right}
.tiles{grid-template-columns:1fr 1fr;gap:25px 0;margin-top:24px}
.tile{padding-inline:14px}
.tile:nth-child(2){padding-right:0;border-right:0}
.tile:nth-child(3){padding-left:0}
.tile h3{font-size:17px}
.tile-number{font-size:30px}
.tile-art{height:100px}
.about{padding-block:60px}
.about-grid{display:block;margin-top:35px}
.seal{width:90px;height:90px;font-size:35px;margin:0 0 30px}
.about h2{font-size:14vw}
.about-copy{grid-template-columns:1fr;gap:20px}
.about-copy p{font-size:16px}
.explore{padding-block:60px}
.explore-header{display:block}
.explore-header p{margin-top:25px}
.explore h2{font-size:16vw}
.topic summary{gap:15px;padding-block:25px}
.topic h3{font-size:10vw}
.topic .tag{display:none}
.plus{margin-left:auto}
.topic-body{padding-left:30px;font-size:16px}
.contact{padding-top:55px}
.contact h2{font-size:19vw;margin-top:40px}
.mail{font-size:9vw;gap:30px}
.footer{margin-top:70px;font-size:9px;flex-wrap:wrap}
.contact-disc{top:25%}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*:before,*:after{animation:none!important;transition:none!important}
.js .reveal{opacity:1;transform:none}
.disc{transform:none!important}
}

/* A quiet transition between the expressive hero and the editorial content. */
.about { border-top: 1px solid var(--ink); }

.navigation a { display: inline-flex; align-items: center; min-height: 44px; }

.motion { min-height: 44px; }

.motion[hidden] { display: none; }

.motion:disabled { cursor: default; opacity: .7; }

.topic-link { display: inline-flex; align-items: center; gap: 20px; min-height: 44px; color: var(--lime); border-bottom: 1px solid currentColor; font-size: 14px; }

.tile:focus-visible .tile-art:after { transform: translate(3px, -3px); }

html:not(.js) *, html:not(.js) *:before, html:not(.js) *:after { animation: none !important; }

[data-motion][data-active="false"], [data-motion][data-active="false"] * { animation-play-state: paused !important; }

body.motion-off *, body.motion-off *:before, body.motion-off *:after { animation-play-state: paused !important; }

body.motion-off .orbit { animation-name: orbit !important; }

@media (max-width: 650px) {
  .topic h3 { font-size: 9vw; }

  .topic summary { gap: 12px; }

  .tile-head { gap: 9px; }

  .tile h3 { font-size: 16px; }

  .footer { line-height: 1.8; }

}


.index-title { font: inherit; margin: 0; }
.curiosity { padding-block: 32px 55px; }
.curiosity-inner { border-top: 1px solid var(--ink); padding-top: 30px; display: grid; grid-template-columns: 1fr 2fr; gap: 60px; }
.curiosity-label { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.curiosity-label h2 { margin: 0; font-size: 12px; }
.curiosity-label > span:last-child { font-size: 10px; text-transform: none; letter-spacing: 0; }
.curiosity-mark { height: 38px; width: 38px; background: var(--orange); display: grid; place-items: center; border-radius: 50%; font-size: 23px; }
.curiosity-content p { font-size: clamp(25px, 3.1vw, 44px); line-height: 1.15; letter-spacing: -.045em; max-width: 700px; min-height: 2.4em; margin: 0; }
.curiosity-controls { display: flex; justify-content: space-between; align-items: center; margin-top: 18px; }
.question-button { display: flex; align-items: center; gap: 12px; border: 0; padding: 0; min-height: 44px; background: transparent; font-size: 12px; }
.question-button[hidden] { display: none; }
.question-button > span:first-child { width: 36px; height: 36px; border: 1px solid var(--ink); border-radius: 50%; display: grid; place-items: center; font-size: 20px; transition: background .2s, color .2s; }
.question-button:hover > span:first-child { color: var(--lime); background: var(--ink); }
@media (max-width: 650px) {
 .curiosity { padding-block: 12px 35px; }
 .curiosity-inner { grid-template-columns: 1fr; gap: 24px; }
 .curiosity-label { display: grid; grid-template-columns: 38px 1fr; align-items: center; column-gap: 12px; row-gap: 2px; }
 .curiosity-mark { grid-row: span 2; }
 .curiosity-content p { font-size: 30px; min-height: 3.45em; }
}
.tile-head { min-height: 44px; }
@media (min-width: 651px) and (max-width: 1000px) { .tile-head { min-height: 60px; } }
@media (max-width: 650px) { .tile-head { min-height: 60px; } }
@media (max-width: 380px) {
 .tile-head { gap: 6px; }
 .tile-number { font-size: 24px; }
 .tile h3 { font-size: 15px; }
}

/* Draw arrows as vectors: iOS must not substitute emoji glyphs. */
.icon-arrow { display: inline-block; width: 1em; height: 1em; flex-shrink: 0; vertical-align: -.1em; }
.icon-arrow--down-left { transform: rotate(180deg); }
.navigation a { gap: .35em; }
.seal { display: flex; align-items: center; justify-content: center; }
.seal .icon-arrow { width: .65em; height: .65em; }
