:root{
  --bg:#0a0102;        /* near black */
  --fg:#fcf9c4;        /* cream */
  --accent:#f68f12;    /* orange */
  --accent2:#c73803;   /* red */
}
*{box-sizing:border-box}
html, body {
  background: radial-gradient(circle at top center, #140306 0%, #0a0102 60%, #050001 100%);
}

/* === GLOBAL TEXT STYLES === */
html, body {
  color: var(--fg);
  font: 16px/1.7 "Segoe UI", Roboto, Inter, system-ui, sans-serif;
}

/* 🕯️ Readable glowing text */
h1, h2, h3, h4, h5, h6 {
  color: var(--fg);
  text-shadow: 0 0 6px rgba(246, 143, 18, 0.25);
  margin-top: 1.4em;
  margin-bottom: 0.6em;
}

p, li {
  color: var(--fg);
  text-shadow: 0 0 4px rgba(255, 255, 255, 0.1);
  margin-bottom: 1.1em;
}

/* Legal & long-form content comfort */
main {
  line-height: 1.8;
  letter-spacing: 0.25px;
  font-size: 1rem;
}

/* 🧡 Optional section dividers for legibility */
main h2 {
  border-bottom: 1px solid rgba(246, 143, 18, 0.25);
  padding-bottom: 6px;
  margin-top: 1.8em;
}

a{color:var(--accent);text-decoration:none}
a:hover{filter:brightness(1.2)}

.site-header{position:sticky;top:0;background:rgba(10,1,2,.8);backdrop-filter:blur(6px);border-bottom:1px solid rgba(255,255,255,.08)}
.nav{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:14px 18px}
.nav ul{display:flex;gap:18px;list-style:none;margin:0;padding:0}
.brand{font-weight:800;letter-spacing:.5px}

.hero{max-width:1100px;margin:72px auto;padding:0 18px;text-align:center}
.hero h1{font-size:clamp(2rem,4.5vw,3.2rem);line-height:1.15;margin:.3em 0;text-shadow:0 0 20px rgba(246,143,18,.25)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:18px}

.btn{display:inline-block;padding:12px 18px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:linear-gradient(180deg,rgba(246,143,18,.18),rgba(246,143,18,.06));box-shadow:0 10px 30px rgba(246,143,18,.15);transition:transform .15s ease, box-shadow .2s ease}
.btn:hover {
  transform: translateY(-3px) scale(1.05);
  box-shadow:
    0 0 20px rgba(246,143,18,0.4),
    0 0 40px rgba(246,143,18,0.2);
}

.site-footer{max-width:1100px;margin:64px auto 40px;padding:0 18px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.08);padding-top:18px;font-size:.9rem}
.legal-nav{display:flex;gap:12px;flex-wrap:wrap}

#pawTrail {
  position: fixed;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 10;
}

/* === PAW DEBUG OVERRIDE === */
img.pawprint {
  position: absolute !important;
  width: 25px !important;
  height: 25px !important;
  max-width: 25px !important;
  max-height: 25px !important;
  object-fit: contain !important;
  opacity: 0.9 !important;
  z-index: 15 !important;
  mix-blend-mode: screen !important;
  filter:
    invert(1)
    sepia(1)
    saturate(12)
    hue-rotate(-20deg)
    drop-shadow(0 0 6px rgba(246,143,18,1))
    drop-shadow(0 0 12px rgba(246,143,18,0.8))
    drop-shadow(0 0 20px rgba(246,143,18,0.5));
}

@keyframes pawFade {
  0% {
    opacity: 0;
    transform: scale(0.8) translateY(4px);
    filter: drop-shadow(0 0 4px rgba(246,143,18,0.4));
  }
  20% {
    opacity: 1;
    transform: scale(1) translateY(0);
    filter: drop-shadow(0 0 12px rgba(246,143,18,0.9));
  }
  60% {
    opacity: 0.8;
    transform: scale(1.05) translateY(-3px);
    filter: drop-shadow(0 0 18px rgba(246,143,18,0.6));
  }
  100% {
    opacity: 0;
    transform: scale(1.1) translateY(-10px);
    filter: drop-shadow(0 0 25px rgba(246,143,18,0.3));
  }
}


.logo-glow {
  width: 120px;
  height: auto;
  margin-bottom: 24px;
  filter:
    drop-shadow(0 0 8px rgba(246,143,18,0.8))
    drop-shadow(0 0 16px rgba(246,143,18,0.5))
    drop-shadow(0 0 32px rgba(246,143,18,0.3));
  animation: logoPulse 4s ease-in-out infinite;
}

@keyframes logoPulse {
  0%, 100% { filter: drop-shadow(0 0 6px rgba(246,143,18,0.8)); transform: scale(1); }
  50%      { filter: drop-shadow(0 0 18px rgba(246,143,18,1)); transform: scale(1.05); }
}

.hero {
  opacity: 0;
  transform: translateY(40px);
  animation: heroReveal 1.8s ease-out forwards;
  animation-delay: 0.3s;
}

@keyframes heroReveal {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.hero h1 {
  animation: glowPulse 6s ease-in-out infinite;
  text-shadow:
    0 0 6px rgba(246,143,18,0.6),
    0 0 14px rgba(246,143,18,0.4),
    0 0 30px rgba(246,143,18,0.2);
}

@keyframes glowPulse {
  0%, 100% { text-shadow: 0 0 6px rgba(246,143,18,0.6), 0 0 14px rgba(246,143,18,0.4); }
  50%      { text-shadow: 0 0 14px rgba(246,143,18,1), 0 0 40px rgba(246,143,18,0.8); }
}

/* 💡 Legal page section dividers */
main section {
  border-top: 1px solid rgba(246, 143, 18, 0.3);
  margin-top: 2.5rem;
  padding-top: 2rem;
  box-shadow: 0 -8px 20px rgba(246, 143, 18, 0.08);
}

/* ✨ Stronger heading glow pulse */
h2, h3 {
  color: var(--fg);
  text-shadow:
    0 0 6px rgba(246,143,18,0.5),
    0 0 12px rgba(246,143,18,0.4),
    0 0 18px rgba(246,143,18,0.3);
  animation: headingPulse 5s ease-in-out infinite;
}

@keyframes headingPulse {
  0%, 100% {
    text-shadow:
      0 0 6px rgba(246,143,18,0.5),
      0 0 12px rgba(246,143,18,0.4);
  }
  50% {
    text-shadow:
      0 0 16px rgba(246,143,18,1),
      0 0 24px rgba(246,143,18,0.8);
  }
}

.tagline {
  font-style: italic;
  color: rgba(246,143,18,0.8);
  text-shadow: 0 0 6px rgba(246,143,18,0.4);
  margin-bottom: 1.5rem;
}

h2, h3 {
  background: linear-gradient(90deg, #f68f12, #fcf9c4);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 8px rgba(246,143,18,0.3);
}

/* === REINSTATE LOGO GLOW + PULSE === */
/* === REINSTATE LOGO GLOW + PULSE — ISOLATED VERSION === */
/* 🦊 Keep logo on its own composite layer */
.logo-glow {
  position: relative; /* creates isolated stacking context */
  will-change: transform, filter; /* hint GPU to isolate */
  z-index: 100;
  animation: logoGlowPulse 4s ease-in-out infinite;
}

/* 🐾 Keep paw prints in their own GPU layer */
img.pawprint {
  will-change: opacity, transform, filter;
  isolation: isolate;
}

/* Rename animations so nothing overlaps internally */
@keyframes logoGlowPulse {
  0%, 100% {
    filter:
      drop-shadow(0 0 6px rgba(246,143,18,0.8))
      drop-shadow(0 0 12px rgba(246,143,18,0.5))
      drop-shadow(0 0 18px rgba(246,143,18,0.3));
    transform: scale(1);
  }
  50% {
    filter:
      drop-shadow(0 0 16px rgba(246,143,18,1))
      drop-shadow(0 0 26px rgba(246,143,18,0.9))
      drop-shadow(0 0 40px rgba(246,143,18,0.7));
    transform: scale(1.05);
  }
}

/* 🐾 Paw alignment + z-index fix */
#pawTrail {
  position: fixed;
  inset: 0;
  pointer-events: none;
  overflow: visible;
  z-index: 9999; /* higher than footer + logo */
}

/* Rotate paws slightly to match walking direction */
/* 🐾 Properly aligned and forward-facing paw prints */
img.pawprint {
  position: absolute !important;
  width: 24px !important;
  height: 24px !important;
  object-fit: contain !important;
  opacity: 0.9 !important;
  z-index: 9999 !important;
  mix-blend-mode: screen !important;
  transform: rotate(90deg); /* flip toes forward */
  animation: pawWalk 8s ease-in-out forwards;
}

/* 👣 Subtle forward trot */
@keyframes pawWalk {
  0% {
    opacity: 0;
    transform: translateX(-20px) rotate(90deg) scale(0.9);
  }
  10% {
    opacity: 1;
    transform: translateX(0) rotate(90deg) scale(1);
  }
  70% {
    opacity: 1;
    transform: translateX(40px) rotate(90deg) scale(1);
  }
  100% {
    opacity: 0;
    transform: translateX(60px) rotate(90deg) scale(1.05);
  }
}

/* === LEGAL PAGE POLISH (for /legal/* pages) === */

/* === LEGAL PAGE POLISH (for /legal/* pages) === */

body.legal-page {
  background: radial-gradient(circle at top center, #120203 0%, #090102 70%, #050001 100%);
  color: var(--fg);
  font-family: "Segoe UI", Roboto, Inter, system-ui, sans-serif;
  line-height: 1.85;
  letter-spacing: 0.3px;
  padding: 2rem 1rem;
}

/* --- Page container for readable width --- */
.legal-container {
  max-width: 850px;
  margin: 0 auto;
}

/* --- Headings --- */
.legal-container h1 {
  font-size: 2.2rem;
  color: var(--fg);
  text-shadow:
    0 0 6px rgba(246,143,18,0.5),
    0 0 14px rgba(246,143,18,0.2);
  border-bottom: 1px solid rgba(246,143,18,0.25);
  padding-bottom: 0.4rem;
}

.legal-container h2 {
  color: var(--accent);
  text-shadow:
    0 0 8px rgba(246,143,18,0.4),
    0 0 20px rgba(246,143,18,0.15);
  margin-top: 2rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(246,143,18,0.15);
}

/* --- Tagline / subtitle --- */
.legal-tagline {
  font-style: italic;
  color: rgba(246,143,18,0.8);
  text-shadow: 0 0 8px rgba(246,143,18,0.3);
  margin-bottom: 2rem;
  opacity: 0;
  animation: fadeInTagline 1.2s ease-out forwards;
}

@keyframes fadeInTagline {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* --- Paragraphs --- */
.legal-container p {
  color: var(--fg);
  text-shadow: 0 0 4px rgba(255,255,255,0.05);
  margin-bottom: 1rem;
}

/* --- Links --- */
.legal-container a {
  color: var(--accent);
  text-decoration: none;
  border-bottom: 1px dotted rgba(246,143,18,0.5);
  transition: all 0.2s ease;
}
.legal-container a:hover {
  color: #fcf9c4;
  border-color: #fcf9c4;
  text-shadow: 0 0 6px rgba(246,143,18,0.8);
}

/* --- Section dividers --- */
.legal-container section {
  padding-bottom: 1.5rem;
  margin-bottom: 2rem;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}

/* --- Footer alignment --- */
.site-footer {
  justify-content: center;
  opacity: 0.8;
  border-top: 1px solid rgba(246,143,18,0.15);
  margin-top: 3rem;
}


/* === Candlelight flicker overlay === */
.candle-flicker {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 180px;
  pointer-events: none;
  background: radial-gradient(circle at 50% 0%, rgba(246,143,18,0.25), transparent 70%);
  mix-blend-mode: screen;
  animation: candleFlicker 5s ease-in-out infinite;
  opacity: 0.8;
  z-index: 1;
}

@keyframes candleFlicker {
  0%, 100% { opacity: 0.6; transform: translateY(0); filter: blur(4px); }
  25%      { opacity: 0.75; transform: translateY(-2px); filter: blur(5px); }
  50%      { opacity: 0.9; transform: translateY(1px); filter: blur(6px); }
  75%      { opacity: 0.7; transform: translateY(-1px); filter: blur(4px); }
}

/* === Breadcrumb Navigation === */
.breadcrumb {
  font-size: 0.9rem;
  margin-bottom: 2rem;
  color: rgba(252, 249, 196, 0.85);
  text-shadow: 0 0 6px rgba(246, 143, 18, 0.3);
}

.breadcrumb a {
  color: var(--accent);
  text-decoration: none;
  transition: color 0.2s ease;
  border-bottom: 1px dotted rgba(246,143,18,0.4);
}

.breadcrumb a:hover {
  color: var(--fg);
  border-color: var(--fg);
}

.breadcrumb span {
  color: rgba(252, 249, 196, 0.6);
  margin: 0 6px;
}