@font-face{
  font-family:LoraLocal;
  src:url("assets/lora-regular.woff2") format("woff2");
  font-style:normal;
  font-display:swap
}
@font-face{
  font-family:LoraLocal;
  src:url("assets/lora-italic.woff2") format("woff2");
  font-style:italic;
  font-display:swap
}
:root{
  --ink:#081b24;
  --ink-deep:#071225;
  --yellow:#ffda16;
  --ivory:#f3f0e7;
  --paper-ink:#16272d;
  --mist:#b7c1bc;
  --line:rgb(243 240 231/.2);
  --serif:LoraLocal,Georgia,serif;
  --sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --container:76rem;
  --ease:180ms ease;
  color-scheme:dark
}
*{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:5.5rem
}
body{
  margin:0;
  overflow-x:hidden;
  background:var(--ink-deep);
  color:var(--ivory);
  font:1rem/1.58 var(--sans)
}
a{
  color:inherit
}
button{
  font:inherit
}
h1,h2,h3,p,a,button,span{
  min-width:0;
  overflow-wrap:anywhere
}
img{
  display:block;
  max-width:100%
}
.container{
  width:min(calc(100% - 2rem),var(--container));
  margin-inline:auto
}
.skip-link{
  position:fixed;
  z-index:30;
  top:.6rem;
  left:.6rem;
  padding:.7rem 1rem;
  background:var(--yellow);
  color:var(--ink);
  transform:translateY(-160%)
}
.skip-link:focus{
  transform:translateY(0)
}
:focus-visible{
  outline:3px solid var(--yellow);
  outline-offset:4px
}
.platform :focus-visible,.audiences :focus-visible,.closing-cta :focus-visible{
  outline-color:var(--ink)
}
.audience-dark :focus-visible{
  outline-color:var(--yellow)
}
.site-header{
  position:sticky;
  z-index:20;
  top:0;
  background:rgb(8 27 36/.94);
  border-bottom:1px solid rgb(243 240 231/.1);
  backdrop-filter:blur(12px)
}
.nav{
  min-height:5rem;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem
}
.brand{
  display:flex;
  align-items:center;
  min-width:0;
  min-height:44px
}
.brand img{
  width:151px;
  height:auto
}
.nav-links,.nav-actions{
  display:flex;
  align-items:center;
  gap:.3rem
}
.nav-actions{
  flex-shrink:0
}
.nav-actions .nav-install{
  min-height:44px
}
.nav-links a,.nav-install{
  min-height:44px;
  display:inline-grid;
  place-items:center;
  padding:.45rem .72rem;
  color:var(--mist);
  text-decoration:none;
  font-size:.9rem
}
.nav-links a:hover,.nav-install:hover{
  color:var(--ivory)
}
.button{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  padding:.72rem 1rem;
  border:1px solid transparent;
  border-radius:0;
  cursor:pointer;
  text-align:center;
  text-decoration:none;
  font-weight:750;
  transition:background-color var(--ease),color var(--ease),border-color var(--ease),transform var(--ease)
}
.button:hover{
  transform:translateY(-2px)
}
.button-primary{
  background:var(--yellow);
  color:var(--ink)
}
.button-primary:hover{
  background:#ffe56b;
  color:var(--ink)
}
.button-outline,.button-line{
  border-color:rgb(243 240 231/.52);
  background:transparent;
  color:var(--ivory)
}
.button-outline:hover,.button-line:hover{
  border-color:var(--yellow);
  color:var(--yellow)
}
.button-small{
  white-space:nowrap;
  min-height:42px;
  padding:.52rem .8rem
}
.hero{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(4.5rem,8vw,8.5rem) 0 clamp(5rem,10vw,9rem);
  background:linear-gradient(116deg,var(--ink) 14%,#0c2730 100%)
}
.hero-grid{
  display:grid;
  align-items:center;
  gap:2.5rem
}
.hero-copy{
  position:relative;
  z-index:2
}
.eyebrow{
  margin:0 0 .85rem;
  color:var(--yellow);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.15em;
  overflow-wrap:anywhere
}
.hero h1,h2,h3{
  margin-top:0;
  text-wrap:balance
}
.hero h1,h2{
  font-family:var(--serif);
  font-weight:400;
  letter-spacing:-.055em;
  line-height:1.04
}
.hero h1{
  max-width:10.5ch;
  margin-bottom:1.35rem;
  font-size:clamp(3rem,6.8vw,6.15rem)
}
.hero h1 em,.closing-cta em{
  color:var(--yellow);
  font-weight:400
}
.hero-lede{
  max-width:35rem;
  margin-bottom:0;
  color:#d2d9d3;
  font-size:clamp(1.06rem,1.7vw,1.22rem)
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:1.35rem;
  margin-top:2rem
}
.text-link{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  color:var(--ivory);
  font-weight:700;
  text-underline-offset:.32em
}
.text-link:hover{
  color:var(--yellow)
}
.hero-note{
  display:flex;
  align-items:center;
  gap:.55rem;
  margin:1.25rem 0 0;
  color:var(--mist);
  font-size:.88rem
}
.hero-note span{
  width:.5rem;
  height:.5rem;
  border-radius:50%;
  background:var(--yellow)
}
.hero-art{
  position:relative;
  width:min(100%,39rem);
  margin:0 auto
}
.hero-art img{
  width:100%;
  height:auto;
  filter:drop-shadow(0 1.6rem 2.4rem rgb(0 0 0/.25))
}
.art-label,.hero-art figcaption{
  position:absolute;
  z-index:1;
  color:#dbe0d6;
  font-size:.72rem;
  font-weight:750;
  letter-spacing:.12em
}
.art-label{
  top:10%;
  right:4%;
  display:flex;
  gap:.55rem;
  align-items:center
}
.art-label span{
  color:var(--yellow)
}
.hero-art figcaption{
  right:7%;
  bottom:9%;
  display:flex;
  align-items:center;
  gap:.5rem
}
.hero-art figcaption i{
  width:3.3rem;
  height:1px;
  background:var(--yellow)
}
.hero-orbit{
  position:absolute;
  z-index:-1;
  border:1px solid rgb(255 218 22/.18);
  border-radius:50%
}
.orbit-a{
  width:55rem;
  height:55rem;
  right:-28rem;
  top:-10rem
}
.orbit-b{
  width:27rem;
  height:27rem;
  left:-18rem;
  bottom:-11rem
}
.platform{
  padding:clamp(5rem,11vw,10rem) 0;
  background:var(--ivory);
  color:var(--paper-ink)
}
.section-intro{
  max-width:48rem
}
.section-intro .eyebrow,.audience-heading .eyebrow{
  color:#715b00
}
.section-intro h2,.audience-heading h2,.install-heading h2{
  margin-bottom:1rem;
  font-size:clamp(2.4rem,5vw,4.8rem)
}
.section-intro>p:last-child{
  max-width:34rem;
  color:#526064;
  font-size:1.1rem
}
.editorial-rows{
  margin-top:clamp(3.5rem,7vw,6rem);
  border-top:1px solid #bbc1b8
}
.editorial-row{
  display:grid;
  grid-template-columns:2.8rem minmax(0,1fr);
  gap:.9rem 1.3rem;
  align-items:center;
  padding:1.8rem 0;
  border-bottom:1px solid #bbc1b8
}
.row-number{
  margin:0;
  color:#715b00;
  font-family:var(--serif);
  font-size:1.25rem
}
.editorial-row h3{
  margin-bottom:.45rem;
  font-family:var(--serif);
  font-size:clamp(1.35rem,2.5vw,2rem);
  font-weight:400;
  letter-spacing:-.035em
}
.editorial-row p:not(.row-number){
  max-width:40rem;
  margin:0;
  color:#526064
}
.row-art{
  grid-column:2;
  height:5.8rem;
  overflow:hidden;
  color:#927800
}
.row-art svg{
  width:100%;
  height:100%;
  fill:none;
  stroke:currentColor;
  stroke-width:1.5
}
.trail-art svg{
  max-width:20rem
}
.trail-art circle{
  fill:var(--ivory);
  stroke-width:2.5
}
.exercise-art{
  display:flex;
  align-items:center;
  gap:.5rem
}
.exercise-art span{
  display:block;
  width:1.4rem;
  background:var(--yellow)
}
.exercise-art span:nth-child(1){
  height:30%
}
.exercise-art span:nth-child(2){
  height:65%;
  background:#bfaa40
}
.exercise-art span:nth-child(3){
  height:100%;
  background:var(--ink)
}
.journal-art svg{
  max-width:20rem
}
.audiences{
  padding:clamp(5rem,9vw,8rem) 0;
  background:#d9ded3;
  color:var(--paper-ink)
}
.audience-layout{
  display:grid;
  gap:3rem;
  min-width:0
}
.audience-heading{
  max-width:29rem
}
.audience-heading h2{
  margin-bottom:0
}
.audience-pair{
  display:grid;
  min-width:0
}
.audience{
  min-width:0;
  min-height:23rem;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:clamp(2rem,5vw,4rem);
  background:#e9e8df
}
.audience-dark{
  background:var(--ink);
  color:var(--ivory)
}
.audience-kicker{
  margin:0 0 auto;
  color:#715b00;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.14em;
  overflow-wrap:anywhere
}
.audience-dark .audience-kicker{
  color:var(--yellow)
}
.audience h3{
  max-width:11ch;
  margin:2.5rem 0 1rem;
  font-family:var(--serif);
  font-weight:400;
  font-size:clamp(1.8rem,3vw,2.7rem);
  letter-spacing:-.05em;
  line-height:1.08
}
.audience>p:not(.audience-kicker){
  max-width:28rem;
  margin-bottom:1.6rem;
  color:#526064
}
.audience-dark>p:not(.audience-kicker){
  color:#c5d0c9
}
.dark-link{
  color:var(--ink)
}
.dark-link:hover{
  color:#716000
}
.company-section{
  padding:clamp(4.5rem,9vw,8rem) 0;
  background:var(--ivory);
  color:var(--paper-ink)
}
.company-section :focus-visible{
  outline-color:var(--ink)
}
.company-section .eyebrow,.principle-mark{
  color:#715b00
}
.company-intro{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:2rem
}
.company-intro h2{
  margin:0;
  font-size:clamp(2.4rem,4.8vw,4.5rem)
}
.company-intro h2 em{
  color:#715b00
}
.company-story{
  max-width:35rem;
  font-size:1.08rem;
  color:#526064
}
.company-story p:first-child{
  margin-top:0
}
.company-principles{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  margin-top:clamp(2.5rem,5vw,4.5rem);
  gap:1.6rem
}
.company-principle{
  border-top:1px solid #bbc1b8;
  padding-top:1.4rem;
  min-width:0
}
.principle-mark{
  display:block;
  margin-bottom:1rem;
  font:1rem var(--serif)
}
.company-principle h3{
  margin-bottom:.6rem;
  font:400 1.55rem/1.2 var(--serif);
  letter-spacing:-.035em
}
.company-principle p{
  margin:0;
  color:#526064;
  max-width:25rem
}
.ecosystem-heading{
  margin-top:clamp(3.5rem,6vw,6rem)
}
.ecosystem-heading h3{
  margin:0 0 1.6rem;
  font:400 clamp(1.7rem,3vw,2.8rem)/1.13 var(--serif);
  letter-spacing:-.035em
}
.ecosystem-links{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  border-top:1px solid #bbc1b8
}
.ecosystem-link{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:.6rem 1rem;
  padding:1.6rem 1rem;
  border-bottom:1px solid #bbc1b8;
  text-decoration:none;
  min-width:0;
  transition:background-color var(--ease)
}
.ecosystem-link:hover,.ecosystem-link:focus-visible{
  background:#e4e7dd
}
.ecosystem-area{
  grid-column:1 / -1;
  color:#526064;
  font-size:.87rem
}
.ecosystem-link strong{
  font-size:clamp(1.7rem,3vw,2.5rem);
  letter-spacing:-.05em;
  line-height:1.15
}
.ecosystem-arrow{
  align-self:center;
  font-size:1.6rem;
  color:#715b00
}
.ecosystem-note{
  grid-column:1 / -1;
  color:#526064;
  font-size:.85rem
}
.company-contact{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:1.2rem 2rem;
  margin-top:2rem;
  padding-top:1.5rem;
  border-top:1px solid var(--line);
  font-size:.85rem;
  color:var(--mist)
}
.company-contact>div{
  min-width:0;
  max-width:100%
}
.company-contact p{
  margin:.25rem 0
}
.contact-links{
  display:flex;
  flex-direction:column;
  align-items:flex-start
}
.contact-links a{
  display:inline-flex;
  align-items:center;
  min-height:44px;
  gap:.4rem;
  text-underline-offset:.25em
}
.contact-links a:hover{
  color:var(--yellow)
}
@media (min-width:600px){
  .ecosystem-links{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media (min-width:760px){
  .company-principles{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:2rem
  }
}
@media (max-width:759px){
  .nav-links{
    display:none
  }
}
@media (min-width:1000px){
  .company-intro{
    grid-template-columns:1.1fr 1fr;
    gap:4rem
  }
  .ecosystem-links{
    grid-template-columns:repeat(4,minmax(0,1fr))
  }
}
.install-section{
  padding:clamp(5rem,10vw,8rem) 0;
  background:var(--ink-deep)
}
.install-layout{
  display:grid;
  gap:3rem;
  min-width:0
}
.install-heading{
  max-width:34rem
}
.install-heading h2{
  margin-bottom:1rem
}
.install-heading>p:last-child{
  color:var(--mist);
  font-size:1.08rem
}
.install-options{
  min-width:0;
  border-top:1px solid var(--line)
}
.install-options article{
  display:grid;
  min-width:0;
  grid-template-columns:2rem 1fr;
  gap:.3rem 1rem;
  padding:1.65rem 0;
  border-bottom:1px solid var(--line)
}
.install-index{
  color:var(--yellow);
  font-family:var(--serif);
  font-size:1.2rem
}
.install-options h3{
  margin:0 0 .25rem;
  font-family:var(--serif);
  font-size:1.5rem;
  font-weight:400
}
.install-options p{
  margin:0;
  color:var(--mist)
}
.install-options .install-note{
  margin-top:.55rem;
  color:#d2d9d3;
  font-size:.82rem
}
.install-options .button{
  grid-column:2;
  justify-self:start;
  margin-top:.7rem
}
.closing-cta{
  position:relative;
  overflow:hidden;
  padding:clamp(5rem,9vw,8rem) 0;
  background:var(--yellow);
  color:var(--ink)
}
.closing-content{
  position:relative
}
.closing-cta .eyebrow{
  color:#5d4b00
}
.closing-cta h2{
  max-width:14ch;
  margin-bottom:2rem;
  font-size:clamp(3rem,6vw,5.6rem)
}
.closing-cta em{
  color:#5e4b00
}
.closing-cta .button-primary{
  background:var(--ink);
  color:var(--ivory)
}
.closing-cta .button-primary:hover{
  background:#16343d
}
.closing-cta::after{
  pointer-events:none;
  content:"";
  position:absolute;
  width:45rem;
  height:45rem;
  border:1px solid rgb(8 27 36/.3);
  border-radius:50%;
  right:-19rem;
  top:-25rem
}
.site-footer{
  padding:2.4rem 0;
  background:var(--ink-deep)
}
.footer-content{
  position:relative;
  display:grid;
  gap:.85rem;
  min-width:0
}
.footer-wordmark{
  min-width:0;
  overflow-wrap:anywhere;
  color:var(--ivory);
  font-size:clamp(1.7rem,3vw,2.6rem);
  font-weight:850;
  letter-spacing:-.09em;
  text-decoration:none
}
.footer-wordmark span{
  color:var(--yellow)
}
.footer-content p{
  margin:0;
  color:var(--mist);
  font-size:.9rem
}
.footer-orbit{
  position:absolute;
  right:0;
  top:.2rem;
  width:4rem;
  height:4rem;
  border:1px solid var(--yellow);
  border-radius:50%
}
.footer-orbit::after{
  content:"";
  position:absolute;
  width:.6rem;
  height:.6rem;
  left:-.3rem;
  top:1.6rem;
  border-radius:50%;
  background:var(--yellow)
}
.install-dialog{
  width:min(calc(100% - 2rem),33rem);
  border:1px solid rgb(243 240 231/.2);
  border-radius:0;
  padding:clamp(1.25rem,4vw,2rem);
  background:var(--ink);
  color:var(--ivory);
  box-shadow:0 1.5rem 4rem rgb(0 0 0/.55)
}
.install-dialog::backdrop{
  background:rgb(0 0 0/.7);
  backdrop-filter:blur(3px)
}
.dialog-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:1rem
}
.dialog-heading h2{
  margin:0;
  font-family:var(--serif);
  font-size:clamp(1.7rem,6vw,2.25rem);
  font-weight:400
}
.install-dialog>p{
  margin-top:1.25rem;
  color:var(--mist)
}
.install-dialog li{
  margin:.7rem 0
}
.install-dialog li a{
  color:var(--yellow);
  font-weight:750
}
.icon-button{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  flex:none;
  padding:0;
  border:1px solid rgb(243 240 231/.25);
  background:transparent;
  color:var(--ivory);
  cursor:pointer
}
.icon-button:hover{
  background:rgb(243 240 231/.1)
}
.icon-button svg{
  width:1.35rem;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round
}
.reveal{
  animation:settle .45s both
}
@keyframes settle{
  from{
    opacity:0;
    transform:translateY(10px)
  }
  to{
    opacity:1;
    transform:translateY(0)
  }
}
@media (min-width:700px){
  .container{
    width:min(calc(100% - 4rem),var(--container))
  }
  .hero-grid{
    grid-template-columns:minmax(0,1.03fr) minmax(22rem,.97fr)
  }
  .editorial-row{
    grid-template-columns:4rem minmax(18rem,.9fr) minmax(12rem,.5fr);
    gap:2rem;
    padding:2.3rem 0
  }
  .row-art{
    grid-column:auto;
    justify-self:end;
    width:100%
  }
  .audience-pair{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)
  }
  .install-options article{
    grid-template-columns:3rem minmax(0,1fr) minmax(0,10.5rem);
    align-items:center;
    gap:1rem 1.5rem
  }
  .install-options .button{
    grid-column:auto;
    margin-top:0
  }
  .footer-content{
    grid-template-columns:minmax(0,1fr) auto;
    align-items:end
  }
  .footer-orbit{
    right:43%
  }
}
@media (min-width:980px){
  .nav{
    grid-template-columns:1fr auto 1fr
  }
  .nav-actions{
    justify-content:end
  }
  .audience-layout,.install-layout{
    grid-template-columns:.72fr 1.28fr;
    align-items:start
  }
  .install-options{
    margin-top:1.4rem
  }
  .closing-content{
    display:grid;
    grid-template-columns:1fr auto;
    align-items:end
  }
  .closing-content .eyebrow,.closing-content h2{
    grid-column:1
  }
  .closing-content .button{
    grid-column:2;
    grid-row:1/span 2
  }
}
@media (max-width:480px){
  .nav-links{
    display:none
  }
  .brand img{
    width:132px
  }
  .nav{
    min-height:4.45rem;
    flex-wrap:wrap;
    gap:.25rem;
    padding-block:.5rem
  }
  .nav-actions .button-small{
    padding:.5rem .55rem;
    font-size:.8rem
  }
  .hero-actions .button{
    width:100%
  }
  .hero-art{
    width:112%;
    margin-left:-6%
  }
  .art-label{
    right:7%
  }
  .hero-art figcaption{
    display:none
  }
  .audience{
    min-height:20rem
  }
  .footer-orbit{
    width:3.3rem;
    height:3.3rem
  }
  .footer-wordmark span{
    display:block
  }
  .eyebrow,.audience-kicker{
    letter-spacing:.08em
  }
}
@media (max-width:260px){
  .container{width:calc(100% - 1rem)}
  .nav{gap:0}
  .brand img{width:78px}
  .button-small{min-height:44px;padding:.5rem .45rem;font-size:.78rem}
  .audience-pair,.install-options,.footer-content,.audience,.install-options article{min-width:0}
  .audience-pair{grid-template-columns:minmax(0,1fr)}
  .install-options article{grid-template-columns:1.4rem minmax(0,1fr)}
  .install-options .button{max-width:100%;white-space:normal}
  .footer-wordmark{overflow-wrap:anywhere;letter-spacing:-.06em}
  .footer-wordmark span{display:block}
}
@media (prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  .reveal{
    animation:none
  }
  *,*::before,*::after{
    transition-duration:.01ms!important;
    animation-duration:.01ms!important
  }
}