/* ============================================================
   Cortex project overrides (loaded AFTER cortex.css).
   Per HNCV direction: all text in Calibri, bolder/confident feel.
   ============================================================ */

/* Sticky footer: fill the viewport on tall screens so there's no dead grey
   space below the footer — the content area grows, the footer pins to bottom. */
body { min-height: 100vh; display: flex; flex-direction: column; }
.page-main { flex: 1 0 auto; display: flex; flex-direction: column; }

/* Make EVERY text Calibri — including the monospace slots (emails, eyebrows,
   kbd) which the base design rendered in IBM Plex Mono. */
:root {
  --font-mono: 'Calibri', 'Carlito', 'Segoe UI', system-ui, sans-serif;
}
.mono, .eyebrow, .kbd, .cx-word {
  font-family: 'Calibri', 'Carlito', 'Segoe UI', system-ui, sans-serif !important;
}

/* Bolder, more confident "Cortex" wordmark (Calibri tops out at 700, so a thin
   stroke adds the extra weight). */
.cx-word {
  font-weight: 700 !important;
  -webkit-text-stroke: 0.8px currentColor;
  text-shadow: 0 0 0.4px currentColor;
}

/* Clean, smooth card hover: lift the whole card crisply. No 3D tilt and no
   icon rotate/scale — those rasterize the layer and blur the small icons. */
.feat-card {
  transition: transform .2s cubic-bezier(.2,.7,.3,1), box-shadow .2s ease, border-color .2s ease;
}
.feat-card:hover { transform: translateY(-4px); box-shadow: var(--sh-lg); }
/* Crisp icon hover: lift + slight tilt (NO scale-up, which rasterises and blurs
   the small icons). Applies to both glyph tiles and the real image icons. */
.feat-card .icon-tile,
.feat-card .app-icon-img { transition: transform .26s cubic-bezier(.2,.8,.3,1.1); }
.feat-card:hover .icon-tile { transform: translateY(-3px) rotate(6deg); }
.feat-card:hover .icon-tile svg { transform: rotate(-6deg); transition: transform .26s cubic-bezier(.2,.8,.3,1.1); }
.feat-card:hover .app-icon-img { transform: translateY(-3px) rotate(5deg); }

/* Confident footer: solid ink, clearly bold (Calibri-700 is thin, so add a
   stroke for visible weight) — applies to the copyright and the links. */
footer .faint,
footer p,
.foot-link,
footer .links a {
  color: var(--ink) !important;
  font-weight: 700 !important;
  -webkit-text-stroke: 0.35px currentColor;
}

/* ------------------------------------------------------------------
   Full-width content fix. `.page-main` is a flex column (for the sticky
   footer); a `.container` child with `margin:0 auto` would otherwise shrink
   to its content's intrinsic width and float in a narrow band (1fr grids
   collapse). `width:100%` makes it fill the column, still capped by --maxw.
   ------------------------------------------------------------------ */
.page-main > .container { width: 100%; }

/* ------------------------------------------------------------------
   Confident typography, app-wide. Calibri tops out at 700, so headings get a
   thin stroke to reach the strong, confident weight the brand wants.
   ------------------------------------------------------------------ */
h1, h2, h3, h4 {
  font-weight: 700 !important;
  -webkit-text-stroke: 0.4px currentColor;
}
.page-title {
  font-weight: 700 !important;
  -webkit-text-stroke: 0.6px currentColor;
}
/* section / panel titles rendered with the display font also go confident */
.ttl, .sect-ttl { -webkit-text-stroke: 0.35px currentColor; }

/* Danger button (global): destructive actions — remove, turn off 2FA, etc. */
.btn-danger { background: transparent; color: oklch(0.55 0.18 25); border-color: oklch(0.78 0.09 25); }
.btn-danger:hover { background: oklch(0.96 0.04 25); border-color: oklch(0.6 0.18 25); color: oklch(0.5 0.2 25); }
[data-theme="dark"] .btn-danger { color: oklch(0.72 0.15 25); border-color: oklch(0.45 0.1 25); }
[data-theme="dark"] .btn-danger:hover { background: oklch(0.32 0.08 25); border-color: oklch(0.6 0.16 25); }