@font-face {
  font-family:"Sora";
  src:url("/assets/fonts/Sora-VariableFont_wght.ttf") format("truetype");
  font-weight:100 800;
  font-style:normal;
  font-display:swap;
}

:root{
  --ink:#111827;
  --cobalt:#245B8F;
  --ice:#EAF1F6;
  --stone:#F4F1EC;
  --slate:#566273;
  --white:#fff;
  --page-pad:clamp(22px,4vw,64px);
  --ease:cubic-bezier(.22,1,.36,1);
}

*{box-sizing:border-box}
html{background:var(--stone)}
body{
  margin:0;
  min-height:100vh;
  font-family:"Sora",system-ui,sans-serif;
  color:var(--ink);
  background:var(--stone);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}

.skip-link{
  position:fixed;
  left:16px;
  top:-80px;
  z-index:4000;
  padding:10px 14px;
  border-radius:8px;
  background:var(--ink);
  color:#fff;
}
.skip-link:focus{top:16px}

.journal-coming{
  min-height:calc(100vh - 200px);
}

.journal-coming-hero{
  padding:clamp(90px,12vw,170px) 0 clamp(100px,13vw,180px);
  overflow:hidden;
}

.journal-coming-shell{
  width:min(calc(100% - (var(--page-pad) * 2)),1180px);
  margin-inline:auto;
  display:grid;
  grid-template-columns:1fr .95fr;
  gap:clamp(54px,8vw,110px);
  align-items:center;
}

.journal-coming-copy{
  max-width:650px;
}

.journal-coming-eyebrow{
  margin:0 0 18px;
  color:var(--cobalt);
  font-size:.66rem;
  font-weight:760;
  letter-spacing:.22em;
}

.journal-coming h1{
  margin:0;
  font-size:clamp(4.2rem,8vw,7.5rem);
  line-height:.92;
  letter-spacing:-.06em;
}

.journal-dot{color:var(--cobalt)}

.journal-coming-lead{
  max-width:620px;
  margin:28px 0 0;
  color:var(--slate);
  font-size:clamp(1.05rem,1.5vw,1.28rem);
  line-height:1.65;
}

.journal-coming-note{
  margin:30px 0 0;
  color:var(--ink);
  font-size:.92rem;
  font-weight:680;
}

.journal-back-link{
  position:relative;
  display:inline-block;
  margin-top:34px;
  padding-bottom:6px;
  font-size:.82rem;
  font-weight:720;
  transition:color 220ms var(--ease),transform 220ms var(--ease);
}
.journal-back-link::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  background:var(--cobalt);
  transform-origin:left;
  transition:transform 220ms var(--ease);
}
.journal-back-link:hover{
  color:var(--cobalt);
  transform:translateY(-1px);
}
.journal-back-link:hover::after{transform:scaleX(.7)}

.journal-coming-orbit{
  position:relative;
  width:min(46vw,520px);
  aspect-ratio:1;
  justify-self:end;
}

.orbit-ring{
  position:absolute;
  inset:50%;
  border:1px solid rgba(36,91,143,.2);
  border-radius:50%;
  transform:translate(-50%,-50%);
}
.ring-a{width:88%;height:88%}
.ring-b{width:58%;height:58%}
.ring-c{width:24%;height:24%}

.orbit-node{
  position:absolute;
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--cobalt);
  box-shadow:0 0 0 7px rgba(36,91,143,.06);
}
.node-a{left:46%;top:4%}
.node-b{right:10%;top:44%}
.node-c{left:26%;bottom:14%}

@media(max-width:820px){
  .journal-coming-shell{grid-template-columns:1fr}
  .journal-coming-orbit{
    width:min(76vw,440px);
    justify-self:center;
  }
}

@media(max-width:620px){
  .journal-coming-hero{padding:72px 0 90px}
  .journal-coming h1{font-size:clamp(3.8rem,18vw,5.6rem)}
}

@media(prefers-reduced-motion:reduce){
  *{transition:none!important}
}