/*
Theme Name:  FoundNXT
Theme URI:   https://foundnxt.com
Author:      FoundNXT Editorial Team
Author URI:  https://foundnxt.com/about/
Description: FoundNXT v1.0 — A modern, fast WordPress theme built for startup founders, investors, and business builders. Features a lively animated hero with word-highlight animations, 21 custom Gutenberg blocks for rich content writing, full dark/light mode, responsive sidebar with live TOC, share buttons, suggested reading, newsletter banner, and Source Serif 4 typography. Startup news, funding rounds, and growth stories — always free.
Version:     1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License:     GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: foundnxt
Tags:        blog, startups, funding, business, dark-mode, custom-colors, custom-logo, custom-blocks, featured-images, full-width-template, sticky-post, threaded-comments, translation-ready
*/

/* ============================================================
   CSS CUSTOM PROPERTIES — Light Mode (default)
   ============================================================ */
:root {
  /* Brand */
  --fnx-primary:        #4f46e5;
  --fnx-primary-dark:   #3730a3;
  --fnx-primary-light:  #eef2ff;
  --fnx-primary-border: #c7d2fe;
  --fnx-primary-mid:    #6366f1;

  /* Accent palette */
  --fnx-blue:         #2563eb;
  --fnx-purple:       #7c3aed;
  --fnx-amber:        #d97706;
  --fnx-rose:         #e11d48;
  --fnx-cyan:         #0891b2;

  /* Typography */
  --fnx-ink:          #1a1a2e;
  --fnx-body:         #374151;
  --fnx-muted:        #6b7280;
  --fnx-subtle:       #9ca3af;

  /* Surfaces */
  --fnx-bg:           #ffffff;
  --fnx-surface:      #f7f8fa;
  --fnx-surface-2:    #f0f2f5;
  --fnx-card:         #ffffff;
  --fnx-border:       #e5e7eb;
  --fnx-border-dark:  #d1d5db;

  /* Shadows */
  --fnx-shadow-sm:    0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);
  --fnx-shadow:       0 2px 8px rgba(0,0,0,.07), 0 4px 16px rgba(0,0,0,.05);
  --fnx-shadow-md:    0 4px 16px rgba(0,0,0,.09), 0 8px 32px rgba(0,0,0,.06);
  --fnx-shadow-primary: 0 4px 20px rgba(79,70,229,.15);

  /* Layout */
  --fnx-radius-sm:    6px;
  --fnx-radius:       10px;
  --fnx-radius-lg:    16px;
  --fnx-max-width:    1140px;
  --fnx-content-width:760px;

  /* Transitions */
  --fnx-transition:   .22s ease;
}

/* ============================================================
   DARK MODE
   ============================================================ */
body.dark-mode,
body[data-theme="dark"],
body[data-mode="dark"],
body.dark,
html.dark body,
html[data-theme="dark"] body {
  --fnx-ink:          #f9fafb;
  --fnx-body:         #e5e7eb;
  --fnx-muted:        #9ca3af;
  --fnx-subtle:       #6b7280;
  --fnx-bg:           #0f1117;
  --fnx-surface:      #1a1f2e;
  --fnx-surface-2:    #222839;
  --fnx-card:         #1e2433;
  --fnx-border:       #2d3748;
  --fnx-border-dark:  #374151;
  --fnx-primary-light:  #052e16;
  --fnx-primary-border: #14532d;
  --fnx-shadow-sm:    0 1px 3px rgba(0,0,0,.4), 0 1px 2px rgba(0,0,0,.3);
  --fnx-shadow:       0 2px 8px rgba(0,0,0,.4), 0 4px 16px rgba(0,0,0,.3);
  --fnx-shadow-md:    0 4px 16px rgba(0,0,0,.5), 0 8px 32px rgba(0,0,0,.4);
}

@media (prefers-color-scheme: dark) {
  body:not(.light-mode):not([data-theme="light"]):not([data-mode="light"]) {
    --fnx-ink:          #f9fafb;
    --fnx-body:         #e5e7eb;
    --fnx-muted:        #9ca3af;
    --fnx-subtle:       #6b7280;
    --fnx-bg:           #0f1117;
    --fnx-surface:      #1a1f2e;
    --fnx-surface-2:    #222839;
    --fnx-card:         #1e2433;
    --fnx-border:       #2d3748;
    --fnx-border-dark:  #374151;
    --fnx-primary-light:  #052e16;
    --fnx-primary-border: #14532d;
  }
}

/* ============================================================
   RESET & BASE
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  font-size: 1rem;
  line-height: 1.75;
  color: var(--fnx-body);
  background: var(--fnx-bg);
  margin: 0;
  transition: background var(--fnx-transition), color var(--fnx-transition);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "kern" 1, "liga" 1, "calt" 1;
  text-rendering: optimizeLegibility;
}

h1,h2,h3,h4,h5,h6 {
  font-family: 'Source Serif 4', 'Georgia', serif;
  color: var(--fnx-ink);
  line-height: 1.2;
  font-weight: 700;
  margin: 0 0 .75em;
  letter-spacing: -.02em;
}

h1 { font-size: clamp(2rem, 4.5vw, 3.25rem); }
h2 { font-size: clamp(1.625rem, 3.2vw, 2.375rem); }
h3 { font-size: clamp(1.3rem, 2.4vw, 1.75rem); }
h4 { font-size: clamp(1.1rem, 1.8vw, 1.375rem); font-family: 'Inter', sans-serif; letter-spacing: -.01em; }
h5 { font-size: 1.125rem; font-family: 'Inter', sans-serif; font-weight: 600; letter-spacing: 0; }
h6 { font-size: 1rem; font-family: 'Inter', sans-serif; font-weight: 600; letter-spacing: .01em; text-transform: uppercase; color: var(--fnx-muted); }

p { margin: 0 0 1.25em; color: var(--fnx-body); }

a { color: var(--fnx-primary); text-decoration: none; transition: color var(--fnx-transition); }
a:hover { color: var(--fnx-primary-dark); }

img { max-width: 100%; height: auto; display: block; }

ul, ol { padding-left: 1.5em; margin: 0 0 1.2em; }
li { margin-bottom: .4em; }

blockquote {
  border-left: 4px solid var(--fnx-primary);
  margin: 1.5em 0;
  padding: 1em 1.5em;
  background: var(--fnx-primary-light);
  border-radius: 0 var(--fnx-radius) var(--fnx-radius) 0;
  font-style: italic;
  color: var(--fnx-ink);
}

code, pre {
  font-family: 'JetBrains Mono', 'Fira Code', monospace;
  font-size: .875em;
  background: var(--fnx-surface);
  border: 1px solid var(--fnx-border);
  border-radius: var(--fnx-radius-sm);
}
code { padding: .15em .4em; }
pre { padding: 1.25em 1.5em; overflow-x: auto; margin: 0 0 1.5em; }
pre code { background: none; border: none; padding: 0; }

hr {
  border: none;
  border-top: 1px solid var(--fnx-border);
  margin: 2em 0;
}

table {
  width: 100%;
  border-collapse: collapse;
  font-size: 1em;
  margin: 0 0 1.5em;
}
th, td {
  padding: .85em 1.1em;
  border: 1px solid var(--fnx-border);
  text-align: left;
}
th {
  background: var(--fnx-surface);
  font-weight: 600;
  color: var(--fnx-ink);
  font-family: 'Inter', sans-serif;
}
tr:nth-child(even) td { background: var(--fnx-surface); }

input, textarea, select {
  font-family: inherit;
  font-size: 1rem;
  background: var(--fnx-bg);
  color: var(--fnx-body);
  border: 1px solid var(--fnx-border);
  border-radius: var(--fnx-radius-sm);
  padding: .6em 1em;
  width: 100%;
  transition: border-color var(--fnx-transition), box-shadow var(--fnx-transition);
}
input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--fnx-primary);
  box-shadow: 0 0 0 3px rgba(79,70,229,.15);
}

button, .btn {
  display: inline-flex;
  align-items: center;
  gap: .5em;
  font-family: 'Inter', sans-serif;
  font-size: .875rem;
  font-weight: 600;
  letter-spacing: .2px;
  padding: .65em 1.6em;
  border: none;
  border-radius: 100px;
  cursor: pointer;
  transition: background var(--fnx-transition), transform var(--fnx-transition), box-shadow var(--fnx-transition), color var(--fnx-transition);
}
.btn-primary {
  background: var(--fnx-primary);
  color: #fff;
  box-shadow: 0 2px 10px rgba(79,70,229,.18);
}
.btn-primary:hover { background: var(--fnx-primary-dark); transform: translateY(-2px); box-shadow: 0 6px 20px rgba(79,70,229,.28); }
.btn-outline {
  background: transparent;
  border: 1.5px solid var(--fnx-primary);
  color: var(--fnx-primary);
}
.btn-outline:hover { background: var(--fnx-primary); color: #fff; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(79,70,229,.22); }
.btn-ghost { background: transparent; color: var(--fnx-muted); border-radius: 100px; }
.btn-ghost:hover { color: var(--fnx-ink); background: var(--fnx-surface); }

/* ============================================================
   LAYOUT UTILITIES
   ============================================================ */
.container {
  max-width: var(--fnx-max-width);
  margin: 0 auto;
  padding: 0 clamp(16px, 4vw, 40px);
}
.container-narrow { max-width: var(--fnx-content-width); margin: 0 auto; padding: 0 clamp(16px, 4vw, 40px); }
.container-wide   { max-width: 1400px; margin: 0 auto; padding: 0 clamp(16px, 4vw, 40px); }

.grid-2 { display: grid; grid-template-columns: repeat(2,1fr); gap: 24px; }
.grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.grid-4 { display: grid; grid-template-columns: repeat(4,1fr); gap: 16px; }
@media(max-width:900px) { .grid-3,.grid-4 { grid-template-columns: repeat(2,1fr); } }
@media(max-width:600px) { .grid-2,.grid-3,.grid-4 { grid-template-columns: 1fr; } }

.flex-center { display: flex; align-items: center; justify-content: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; }
.flex-gap { display: flex; align-items: center; gap: 12px; }

.text-center { text-align: center; }
.text-green  { color: var(--fnx-primary); }
.text-muted  { color: var(--fnx-muted); }
.text-ink    { color: var(--fnx-ink); }
.fw-700 { font-weight: 700; }
.mt-0 { margin-top: 0; }
.mb-0 { margin-bottom: 0; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0; }

/* ============================================================
   ACCESSIBILITY
   ============================================================ */
:focus-visible {
  outline: 2px solid var(--fnx-primary);
  outline-offset: 3px;
}
.skip-link {
  position: absolute;
  top: -100px;
  left: 16px;
  background: var(--fnx-primary);
  color: #fff;
  padding: .5em 1em;
  border-radius: 0 0 var(--fnx-radius-sm) var(--fnx-radius-sm);
  font-weight: 600;
  z-index: 9999;
  transition: top .2s;
}
.skip-link:focus { top: 0; }