/* ============================================================
   Cognuum — COMING SOON (parked page)
   The site is temporarily parked behind a hero-only page: the
   brand mark, the rotating dot-globe and the manifesto copy —
   and NOTHING that navigates. No top bar, no footer, no CTAs,
   no links of any kind (www/vercel.json redirects the live host
   here). It reuses base.css (tokens + stage), hero.css (the
   manifesto layout) and responsive.css (the mobile composition);
   this file only places the non-navigational chrome the parked
   page keeps — the brand mark and the light/dark toggle — so we
   never pull in topbar.css's header + Member Access nav.
   ============================================================ */

/* ----- brand mark, top-left (NON-interactive: a parked page has
   no "home" to link to, so the lockup is a plain element, never a
   link). Mirrors the top bar's placement so the mark sits exactly
   where it does on the real site. ----- */
.cs-mark{
  position:fixed; top:0; left:0;
  height:128px;
  display:flex; align-items:center;
  padding:0 var(--pad-x);
  z-index:100;
  font-size:21px; font-weight:400; letter-spacing:0.42em;
  color:var(--ink-wordmark);
  pointer-events:none;              /* nothing to click — it is not a link */
}

/* ----- light/dark toggle — a control, not a link. Copied from
   topbar.css so this page needs only the toggle, not the header. ----- */
.icon-btn{
  background:none; border:none; cursor:pointer; color:var(--ink-icon);
  display:flex; align-items:center; justify-content:center;
  position:relative; padding:0;
}
.icon-btn svg{ width:24px; height:24px; stroke:currentColor; stroke-width:1.6; fill:none; }

#theme-toggle{
  position:fixed; bottom:26px; right:26px; z-index:120;
  width:30px; height:30px; padding:0;
  background:none; border:0; box-shadow:none;
  color:var(--text-secondary); opacity:0.55;
  transition:opacity .3s ease, transform .35s cubic-bezier(.22,.61,.18,1), color .3s ease;
}
#theme-toggle:hover{ opacity:1; transform:rotate(15deg); color:var(--text-primary); }
#theme-toggle svg{ width:22px; height:22px; stroke-width:1.25; }

/* ===================== TABLET ===================== */
@media (max-width:1199px){
  .cs-mark{ height:88px; padding:0 44px; }
}

/* ===================== MOBILE ===================== */
@media (max-width:767px){
  .cs-mark{ height:72px; padding:0 26px; font-size:17px; letter-spacing:0.34em; }
  #theme-toggle{ bottom:14px; right:20px; }
}
