/* Shared Faith Through Physics site shell. */
:root{
  --shell-bg:rgba(5,5,5,.97);
  --shell-surface:#0a0a0a;
  --shell-border:#222;
  --shell-border-hi:#333;
  --shell-text:#e5e3df;
  --shell-text-dim:#999;
  --shell-text-muted:#555;
  --shell-gold:#d4af37;
  --shell-gold-dim:rgba(212,175,55,.08);
}

.site-shell-top{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:70;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 1.25rem;
  background:var(--shell-bg);
  border-bottom:1px solid var(--shell-border);
}

.site-shell-top::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:2px;
  background:linear-gradient(90deg,rgba(201,64,64,.35),var(--shell-gold),rgba(91,155,213,.35));
  opacity:.7;
}

.site-shell-home,
.site-shell-series{
  display:flex;
  align-items:center;
  gap:.35rem;
  color:var(--shell-text-dim);
  font-family:var(--sans, Inter, system-ui, sans-serif);
  font-size:.7rem;
  font-weight:600;
  letter-spacing:.04em;
  text-decoration:none;
  transition:color .15s ease,background .15s ease;
  white-space:nowrap;
}

.site-shell-home{
  color:var(--shell-text-muted);
  font-weight:400;
}

.site-shell-home:hover,
.site-shell-series:hover{
  color:var(--shell-gold);
}

.site-shell-center{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:.6rem;
}

.site-shell-side-label{
  color:var(--shell-text-muted);
  font-family:var(--mono, ui-monospace, monospace);
  font-size:.58rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.site-shell-tabs{
  display:flex;
  align-items:center;
  border:1px solid var(--shell-border);
  border-radius:5px;
  overflow:hidden;
  background:rgba(255,255,255,.01);
}

.site-shell-tab{
  padding:.32rem .75rem;
  border-right:1px solid var(--shell-border);
  color:var(--shell-text-muted);
  font-family:var(--mono, ui-monospace, monospace);
  font-size:.56rem;
  font-weight:500;
  letter-spacing:.1em;
  line-height:1.3;
  text-transform:uppercase;
  text-decoration:none;
  white-space:nowrap;
  transition:all .15s ease;
}

.site-shell-tab:last-child{
  border-right:0;
}

.site-shell-tab:hover,
.site-shell-tab.is-active{
  color:var(--shell-gold);
  background:var(--shell-gold-dim);
}

.site-shell-subdomains{
  border-top:1px solid var(--shell-border);
  border-bottom:1px solid var(--shell-border);
  background:var(--shell-surface);
  padding:.85rem 1rem;
}

.site-shell-subdomain-inner{
  max-width:1100px;
  margin:0 auto;
  display:flex;
  justify-content:center;
  gap:.1rem;
  flex-wrap:wrap;
}

.site-shell-subdomain-link{
  display:flex;
  align-items:center;
  gap:.3rem;
  min-height:30px;
  padding:.3rem .55rem;
  border-radius:4px;
  color:var(--shell-text-muted);
  font-family:var(--mono, ui-monospace, monospace);
  font-size:.6rem;
  letter-spacing:.1em;
  line-height:1.2;
  text-transform:uppercase;
  text-decoration:none;
  transition:all .15s ease;
}

.site-shell-subdomain-link:hover{
  color:var(--shell-gold);
  background:var(--shell-gold-dim);
}

.site-shell-dot{
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--shell-text-muted);
  opacity:.35;
  flex:0 0 auto;
  transition:all .15s ease;
}

.site-shell-subdomain-link:hover .site-shell-dot{
  background:var(--shell-gold);
  opacity:.8;
}

.site-shell-credit{
  border-top:1px solid var(--shell-border);
  text-align:center;
  padding:.85rem 1rem;
  color:var(--shell-text-muted);
  font-family:var(--mono, ui-monospace, monospace);
  font-size:.6rem;
  letter-spacing:.06em;
  background:#050505;
}

body.site-shell-enabled .ph{
  top:46px;
}

body.site-shell-enabled .hero{
  padding-top:10rem;
}

@media(max-width:820px){
  .site-shell-top{
    min-height:46px;
    height:auto;
    flex-wrap:wrap;
    gap:.45rem .75rem;
    padding:.5rem 1rem;
  }

  .site-shell-center{
    position:static;
    transform:none;
    order:3;
    width:100%;
    justify-content:center;
  }

  .site-shell-side-label{
    display:none;
  }

  .site-shell-tab{
    padding:.34rem .5rem;
    font-size:.52rem;
  }

  body.site-shell-enabled .ph{
    top:86px;
  }

  body.site-shell-enabled .hero{
    padding-top:12rem;
  }
}

@media(max-width:520px){
  .site-shell-series{
    font-size:0;
  }

  .site-shell-series svg{
    margin-left:0;
  }

  .site-shell-tabs{
    width:100%;
  }

  .site-shell-tab{
    flex:1;
    text-align:center;
    padding-left:.35rem;
    padding-right:.35rem;
  }
}
