/* ============================================================
   CodebyCarter — logo.css
   Italic-serif wordmark. Pure typography. No mark, no box.
   Signed-by-hand energy.
   ============================================================ */

/* Hide the old SVG mark — the wordmark is the whole logo */
.brand .mark{display:none}

.brand{
  display:inline-flex;align-items:baseline;gap:0;
  cursor:none;
  text-decoration:none;
  letter-spacing:0;
}

.brand-mark{
  font-family:'Instrument Serif',serif;
  font-style:italic;
  font-weight:400;
  font-size:26px;
  letter-spacing:-.022em;
  line-height:1;
  color:inherit;
  display:inline-block;
  transition:transform .35s cubic-bezier(.16,1,.3,1), color .5s ease;
}

.brand:hover .brand-mark{
  transform:translateY(-1px);
}

/* The leading 'c' gets a subtle flourish — larger, tighter, hand-set */
.brand-mark .brand-c{
  display:inline-block;
  font-size:1.18em;
  letter-spacing:-.06em;
  margin-right:-1px;
  background:linear-gradient(135deg,#A855F7,#EC4899);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  transition:background 1s ease;
}

/* When in dark stages the C still has a gradient — pulls color from the page's vibe */
body[data-stage="slate"] .brand-mark .brand-c,
body[data-stage="midnight"] .brand-mark .brand-c,
body[data-stage="neon"] .brand-mark .brand-c,
body[data-stage="chaos"] .brand-mark .brand-c,
body[data-stage="signature"] .brand-mark .brand-c{
  background:linear-gradient(135deg,#EC4899,#FB923C);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* Subtle period at the end — signature feel */
.brand-mark::after{
  content:".";
  margin-left:1px;
  background:linear-gradient(135deg,#A855F7,#EC4899);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
body[data-stage="slate"] .brand-mark::after,
body[data-stage="midnight"] .brand-mark::after,
body[data-stage="neon"] .brand-mark::after,
body[data-stage="chaos"] .brand-mark::after,
body[data-stage="signature"] .brand-mark::after{
  background:linear-gradient(135deg,#EC4899,#FB923C);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}

/* Nav padding nudge since there's no boxy mark anymore */
.nav{padding:12px 16px 12px 22px}

/* Mobile — slightly smaller wordmark */
@media (max-width:600px){
  .brand-mark{font-size:22px}
  .brand-mark .brand-c{font-size:1.15em}
}

/* Footer: a bigger version of the wordmark as the sign-off */
.footer-brand-mark{
  font-family:'Instrument Serif',serif;
  font-style:italic;font-weight:400;
  font-size:32px;letter-spacing:-.025em;line-height:1;
  background:linear-gradient(135deg,#F5F5F7 0%,#A855F7 40%,#EC4899 80%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.footer-brand-mark .brand-c{
  font-size:1.18em;letter-spacing:-.06em;display:inline-block;
}
.footer-brand-mark::after{content:".";color:#FB923C;-webkit-text-fill-color:#FB923C}