/* Slid Phi Labs — brand header (big wordmark + themed visual field) */
.logo{
  position:relative;
  display:inline-flex !important;
  align-items:center;
  gap:14px !important;
  padding:10px 16px 10px 12px;
  border-radius:16px;
  overflow:hidden;
  isolation:isolate;
  font-family:'Cinzel',serif !important;
  font-weight:700 !important;
  color:var(--gold, #e8c547) !important;
  font-size:clamp(1.45rem, 3.8vw, 2.35rem) !important;
  line-height:1.05 !important;
  letter-spacing:.05em !important;
  text-decoration:none !important;
  text-shadow:
    0 0 28px rgba(232,197,71,.45),
    0 0 48px rgba(61,214,198,.2),
    0 2px 0 rgba(0,0,0,.35) !important;
  border:1px solid rgba(232,197,71,.28);
  box-shadow:
    0 0 0 1px rgba(61,214,198,.08) inset,
    0 8px 32px rgba(0,0,0,.35),
    0 0 40px rgba(232,197,71,.12);
  transition:border-color .2s, box-shadow .2s, transform .2s;
}
.logo:hover{
  border-color:rgba(232,197,71,.55);
  box-shadow:
    0 0 0 1px rgba(61,214,198,.15) inset,
    0 10px 40px rgba(0,0,0,.4),
    0 0 56px rgba(232,197,71,.22),
    0 0 40px rgba(61,214,198,.18);
  transform:translateY(-1px);
}
/* Themed visual field behind wordmark */
.logo::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse 80% 120% at 15% 50%, rgba(232,197,71,.22), transparent 55%),
    radial-gradient(ellipse 70% 100% at 85% 40%, rgba(61,214,198,.18), transparent 50%),
    radial-gradient(circle at 50% 120%, rgba(255,154,60,.12), transparent 45%),
    linear-gradient(135deg, rgba(8,16,28,.92) 0%, rgba(12,22,40,.85) 45%, rgba(5,11,22,.95) 100%),
    url("/assets/slid-phi-labs-master.jpg") 42% 28%/cover no-repeat;
  opacity:.95;
  filter:saturate(1.15) contrast(1.05) brightness(.55);
}
/* Mandala / ring etch */
.logo::after{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  width:min(140%, 220px);
  height:min(220%, 160px);
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  background:
    repeating-conic-gradient(from 0deg at 50% 50%,
      transparent 0deg 8deg,
      rgba(232,197,71,.06) 8deg 9deg),
    radial-gradient(circle at 50% 50%, transparent 28%, rgba(61,214,198,.1) 29%, transparent 32%),
    radial-gradient(circle at 50% 50%, transparent 42%, rgba(232,197,71,.12) 43%, transparent 46%);
  opacity:.85;
  animation:logoRingSpin 48s linear infinite;
}
@keyframes logoRingSpin{
  to{transform:translate(-50%,-50%) rotate(360deg)}
}
@media (prefers-reduced-motion: reduce){
  .logo::after{animation:none}
}
.logo img,
.logo > img{
  position:relative;
  z-index:1;
  width:clamp(48px, 7vw, 72px) !important;
  height:clamp(48px, 7vw, 72px) !important;
  border-radius:50% !important;
  object-fit:cover;
  border:2px solid rgba(232,197,71,.55) !important;
  box-shadow:
    0 0 0 2px rgba(61,214,198,.2),
    0 0 28px rgba(61,214,198,.4),
    0 0 36px rgba(232,197,71,.25) !important;
  flex-shrink:0;
}
.logo-word,
.logo .logo-word{
  position:relative;
  z-index:1;
  display:inline-flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
}
/* When plain text nodes are used (no .logo-word wrapper), still sit above field */
.logo{
  color:var(--gold, #e8c547);
}
.logo span,
.logo .logo-labs{
  color:var(--teal-bright, #5ef0df) !important;
  font-weight:600 !important;
  text-shadow:0 0 20px rgba(61,214,198,.45);
}
.logo .logo-slid{
  color:var(--gold, #e8c547);
  display:block;
}
.logo .logo-labs{
  display:block;
  font-size:.72em;
  letter-spacing:.18em;
  text-transform:uppercase;
  margin-top:1px;
}
/* Nav bar breathes for taller brand */
nav .inner{
  padding-top:12px !important;
  padding-bottom:12px !important;
  align-items:center !important;
  gap:14px !important;
}
nav{
  border-bottom:1px solid rgba(232,197,71,.22) !important;
  box-shadow:
    0 1px 0 rgba(61,214,198,.1),
    0 12px 40px rgba(0,0,0,.25) !important;
}
/* Mobile: still large, wrap cleanly */
@media (max-width:560px){
  .logo{
    font-size:clamp(1.2rem, 6.5vw, 1.65rem) !important;
    gap:10px !important;
    padding:8px 12px 8px 10px;
    max-width:100%;
  }
  .logo .logo-labs{letter-spacing:.12em}
}
