/*
 * Temperature Zero — Site Design System (tz-system) — v1.0
 *
 * ONE source of truth for the dashboard design language, loaded SITE-WIDE
 * (global wp_enqueue_scripts block, after tz-style). Extracted 2026-05-29 from
 * landing-redesign.1.8.css so the interior pages can share the same palette,
 * tokens, animations, header, footer, and the conic Subscribe button — instead
 * of those living front-page-only.
 *
 * What lives here (the genuinely shared layer):
 *   1. --tz-c-* palette + --tzr-* tokens, on :root (header/footer are OUTSIDE
 *      .tz-landing, so tokens MUST be on :root — see the v1.4 conic gotcha).
 *   2. Shared keyframes + @property --tz-angle.
 *   3. .tz-conic helper + the rotating-border Subscribe button technique.
 *   4. Header / nav treatment (header markup is global).
 *   5. The rich multi-column footer (now rendered site-wide, footer.php).
 *
 * What stays page-scoped (NOT here):
 *   - landing-redesign.1.9.css  → everything under .tz-landing / landing modules.
 *   - tz-interior.1.0.css       → interior page hero, ambient glow, prose, panels.
 *
 * Load order on the homepage is unchanged in effect: this file loads before
 * landing-modules + landing-redesign, and only carries rules those files do not
 * also target, so the homepage renders byte-identical. Rollback = dequeue
 * tz-system + restore landing-redesign.1.8 enqueue.
 */

/* ════════════════════════════════════════════════════════════
   1. Tokens — the dashboard palette + radii/cards/glow/gradient.
   Base --tz-* tokens (bg, border, accent, text, muted, heading,
   sans, mono, spacing, radius) already live globally in style.css.
   ════════════════════════════════════════════════════════════ */
:root {
    --tz-c-cyan:   #4af0c8;   /* brand / logo / bright stop */
    --tz-c-teal:   #46d6d0;
    --tz-c-blue:   #55abea;
    --tz-c-indigo: #6d8fee;
    --tz-c-violet: #9a6cf0;
    --tz-c-purple: #ab51e7;
    --tz-c-green:  #4af0a0;
    --tz-c-amber:  #e8923a;   /* warm accent — subscribe bar only */

    --tzr-radius:    12px;
    --tzr-radius-sm: 9px;
    --tzr-card:      #0d0d16;
    --tzr-card-2:    #0b0b13;
    --tzr-glow:      0 0 24px rgba(74,240,200,0.18);
    --tzr-grad:      linear-gradient(100deg, var(--tz-c-cyan), var(--tz-c-blue), var(--tz-c-violet), var(--tz-c-cyan));
}
/* NOTE: --tz-serif is intentionally NOT defined here. The homepage's
   .tz-pillar__desc references var(--tz-serif) with no fallback, so defining it
   would change the homepage pillar font (it currently inherits). Interior pages
   that want a serif define it locally in tz-interior. */

/* ════════════════════════════════════════════════════════════
   2. Shared keyframes + registered angle (referenced everywhere)
   ════════════════════════════════════════════════════════════ */
@property --tz-angle { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
@keyframes tz-rotate   { to { --tz-angle: 360deg; } }
@keyframes tz-shimmer  { to { background-position: 300% 0; } }
@keyframes tz-pulse    { 0%,100% { opacity: 0.4; } 50% { opacity: 1; } }
@keyframes tz-ambiance { from { opacity: 0.65; } to { opacity: 1; } }

/* Reusable shimmer kicker — animated multi-hue gradient clipped to text.
   Generic (not scoped to .tz-landing) so interior kickers shimmer too.
   The homepage's own `.tz-landing .tz-module-kicker` rule (higher specificity,
   in landing-redesign) still wins there, so this changes nothing on the home
   page. */
.tz-kicker-shimmer,
.tz-module-kicker,
.tz-hero__kicker,
.tz-subscribe-copy__kicker {
    background: var(--tzr-grad);
    background-size: 300% 100%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    animation: tz-shimmer 7s linear infinite;
}

/* ════════════════════════════════════════════════════════════
   3. Rotating conic-gradient border helper (Subscribe buttons).
   Multi-hue ring, brand cyan is the bright stop; dark interior.
   Robust technique: transparent border filled by a conic on the
   border-box, opaque interior on the padding-box. No pseudo, no
   z-index painting-order traps, no mask (see v1.4 gotchas).
   ════════════════════════════════════════════════════════════ */
.tz-conic {
    position: relative;
    isolation: isolate;
    border-radius: var(--tzr-radius-sm);
    background: #0c0b14;
    color: #ffffff;
    z-index: 0;
}
.tz-conic::before,
.tz-conic::after {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: inherit;
    z-index: -1;
    background: conic-gradient(from var(--tz-angle),
        var(--tz-c-violet) 0deg,
        var(--tz-c-blue)   65deg,
        var(--tz-c-cyan)   140deg,   /* bright stop = brand color */
        var(--tz-c-green)  205deg,
        var(--tz-c-purple) 290deg,
        var(--tz-c-violet) 360deg);
    animation: tz-rotate 4s linear infinite;
}
.tz-conic::after { inset: -7px; filter: blur(14px); opacity: 0.5; }
@media (prefers-reduced-motion: reduce) {
    .tz-conic::before, .tz-conic::after { animation: none; }
    .tz-conic::after { opacity: 0.35; }
}

/* ════════════════════════════════════════════════════════════
   4. Header / nav — now site-wide so every page shares the
   translucent blurred bar + the conic Subscribe CTA.
   ════════════════════════════════════════════════════════════ */
.tz-header { background: rgba(10,10,15,0.88); backdrop-filter: blur(10px); }
.tz-nav-list { gap: 4px; }
.tz-nav-list li a {
    font-family: var(--tz-sans);
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 8px 14px;
}
/* nav Subscribe CTA — rotating conic-gradient BORDER. */
.tz-nav-list li.tz-nav-cta a {
    position: relative;
    border: 1.5px solid transparent;
    border-radius: var(--tzr-radius-sm);
    background:
        linear-gradient(#0c0b14, #0c0b14) padding-box,
        conic-gradient(from var(--tz-angle),
            var(--tz-c-violet) 0deg, var(--tz-c-blue) 65deg, var(--tz-c-cyan) 140deg,
            var(--tz-c-green) 205deg, var(--tz-c-purple) 290deg, var(--tz-c-violet) 360deg) border-box;
    color: #ffffff !important;
    font-weight: 600;
    animation: tz-rotate 4s linear infinite;
}
.tz-nav-list li.tz-nav-cta a::before,
.tz-nav-list li.tz-nav-cta a::after { display: none; }
@media (prefers-reduced-motion: reduce) {
    .tz-nav-list li.tz-nav-cta a { animation: none; }
}

/* ════════════════════════════════════════════════════════════
   5. Footer — multi-column dashboard footer + tz° TERMINAL.
   Rendered site-wide by footer.php; styling here so every page
   shares it. (Relocated verbatim from landing-redesign.)
   ════════════════════════════════════════════════════════════ */
.tz-footer-redesign { background: #07070d; border-top: 1px solid var(--tz-border); }
.tz-footer-grid { max-width: 1240px; margin: 0 auto; padding: 2.75rem 1.5rem 1.75rem; display: grid; grid-template-columns: 1.6fr 1fr 1fr 1.1fr; gap: 2rem; }
.tz-footer-brand__logo { font-family: var(--tz-sans); font-weight: 600; color: var(--tz-heading); font-size: 1.05rem; text-decoration: none; }
.tz-footer-brand__logo .tz-deg { color: var(--tz-c-cyan); }
.tz-footer-brand__tag { color: var(--tz-muted); font-size: 0.85rem; line-height: 1.6; margin: 0.7rem 0 1rem; max-width: 34ch; }
.tz-footer-brand .tz-footer-social { display: flex; gap: 0.85rem; }
.tz-footer-brand .tz-footer-social a { color: var(--tz-muted); transition: color 180ms ease; }
.tz-footer-brand .tz-footer-social a:hover { color: var(--tz-c-cyan); }
.tz-footer-col h4 { font-family: var(--tz-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--tz-muted); margin: 0 0 0.85rem; }
.tz-footer-col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
.tz-footer-col a { color: var(--tz-text); text-decoration: none; font-size: 0.85rem; transition: color 180ms ease; }
.tz-footer-col a:hover { color: var(--tz-c-cyan); }
.tz-terminal { background: var(--tzr-card); border: 1px solid var(--tz-border); border-radius: var(--tzr-radius); padding: 1rem 1.1rem; font-family: var(--tz-mono); font-size: 11px; }
.tz-terminal__bar { display: flex; align-items: center; gap: 0.4rem; margin-bottom: 0.7rem; }
.tz-terminal__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--tz-border); }
.tz-terminal__dot--live { background: var(--tz-c-cyan); box-shadow: 0 0 7px var(--tz-c-cyan); animation: tz-pulse 2.4s ease-in-out infinite; }
.tz-terminal__name { margin-left: auto; color: var(--tz-muted); letter-spacing: 0.1em; }
.tz-terminal__name .tz-deg { color: var(--tz-c-cyan); }
.tz-terminal__line { color: var(--tz-muted); line-height: 1.7; }
.tz-terminal__line b { color: var(--tz-c-cyan); font-weight: 500; }
.tz-footer-bottom-redesign { max-width: 1240px; margin: 0 auto; padding: 1.2rem 1.5rem; border-top: 1px solid var(--tz-border); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem; font-family: var(--tz-mono); font-size: 11px; color: var(--tz-muted); }
@media (max-width: 900px) { .tz-footer-grid { grid-template-columns: 1fr 1fr; } }