/* =========================================================
   INNELLIS_PUBLIC_MARKETING_LIGHT_V1

   Public marketing / SEO visual system.

   Product and marketing share one brand language,
   but this stylesheet is intentionally separate from
   authenticated product-light.css.

   Roles:
   Navy  = authority / structure
   Blue  = research / interaction
   Amber = Innellis brand / attention
   Green = positive financial meaning
   Red   = financial risk
   ========================================================= */


/* ──────────────────────────────────────────────────────────
   CORE TOKENS
   ────────────────────────────────────────────────────────── */

:root {
  --bg: #F6F8FB;
  --background: #F6F8FB;

  --surface: #FFFFFF;
  --surface1: #FFFFFF;
  --surface2: #F1F5F9;
  --surface3: #E8EEF5;

  --card: #FFFFFF;
  --card-bg: #FFFFFF;

  --text: #18283B;
  --text-primary: #18283B;
  --heading: #1D3047;

  --muted: #63758A;
  --text-muted: #63758A;

  --border: #D7E0E9;
  --border-light: #E5EBF1;

  --blue: #356AE6;
  --blue-soft: #EAF1FF;
  --blue-border: #C9D8FA;

  --amber: #E79300;
  --amber-soft: #FFF6E5;
  --amber-border: #F3BF64;

  --green: #268A4A;
  --green-soft: #EFF9F2;
  --green-border: #C9E8D2;

  --red: #C9433E;
  --red-soft: #FFF2F1;
  --red-border: #F0CECB;

  --marketing-shadow:
    0 2px 6px rgba(24,40,59,.04),
    0 14px 36px rgba(24,40,59,.07);
}


/* ──────────────────────────────────────────────────────────
   PAGE CANVAS
   ────────────────────────────────────────────────────────── */

html,
body {
  background: #F6F8FB !important;
  color: #18283B !important;
}


/*
 * Avoid turning the whole site into bright white.
 * Alternate surfaces retain visual depth.
 */

main,
.page,
.page-shell,
.content,
.main-content {
  color: #18283B;
}


/* ──────────────────────────────────────────────────────────
   TYPOGRAPHY
   ────────────────────────────────────────────────────────── */

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #1D3047 !important;
}

p,
li {
  color: inherit;
}

.subtitle,
.sub,
.description,
.muted,
.section-note,
.meta,
.helper,
small {
  color: #63758A !important;
}


/* ──────────────────────────────────────────────────────────
   HEADER / NAVIGATION
   ────────────────────────────────────────────────────────── */

header,
.site-header,
.topbar,
.navbar,
nav {
  border-color: #D7E0E9 !important;
}

header,
.site-header,
.topbar,
.navbar {
  background: rgba(255,255,255,.96) !important;
}


/* Ordinary navigation */

nav a:not(.btn):not(.button):not(.cta),
.nav-link {
  color: #35485E;
}


/* ──────────────────────────────────────────────────────────
   HERO
   ────────────────────────────────────────────────────────── */

/*
 * Marketing stays more expressive than the product.

 * Instead of a dark wall, use a light research-oriented
 * gradient with subtle Innellis amber / blue presence.
 */

.hero,
.hero-section,
.home-hero,
.landing-hero {
  background:
    radial-gradient(
      circle at 84% 16%,
      rgba(53,106,230,.10),
      transparent 34%
    ),
    radial-gradient(
      circle at 10% 15%,
      rgba(231,147,0,.08),
      transparent 30%
    ),
    linear-gradient(
      180deg,
      #FFFFFF 0%,
      #F3F7FC 100%
    ) !important;

  color: #18283B !important;
}

.hero h1,
.hero-section h1,
.home-hero h1,
.landing-hero h1 {
  color: #172B43 !important;
}

.hero p,
.hero-section p,
.home-hero p,
.landing-hero p {
  color: #5A6D82 !important;
}


/* ──────────────────────────────────────────────────────────
   SECTIONS
   ────────────────────────────────────────────────────────── */

section {
  border-color: #E2E8EF;
}

.section-alt,
.alt-section,
.features-section,
.research-section,
.market-section {
  background: #F1F5F9 !important;
}


/* ──────────────────────────────────────────────────────────
   CARDS
   ────────────────────────────────────────────────────────── */

.card,
.panel,
.feature-card,
.research-card,
.stock-card,
.sector-card,
.compare-card,
.metric-card,
.stat-card,
.content-card,
.info-card {
  background: #FFFFFF !important;
  border-color: #D7E0E9 !important;

  box-shadow:
    0 2px 5px rgba(24,40,59,.035),
    0 10px 28px rgba(24,40,59,.055);
}

.card:hover,
.feature-card:hover,
.research-card:hover,
.stock-card:hover,
.sector-card:hover,
.compare-card:hover {
  border-color: #C3D2E2 !important;
}


/* ──────────────────────────────────────────────────────────
   CARD HEADERS / SECTION HEADERS
   ────────────────────────────────────────────────────────── */

.card-header,
.panel-header,
.section-header,
.table-header {
  background: #EDF2F7 !important;
  color: #24364B !important;
  border-color: #D4DEE9 !important;
}


/* ──────────────────────────────────────────────────────────
   PRIMARY CTAs
   ────────────────────────────────────────────────────────── */

a.btn-primary,
button.btn-primary,
.primary-btn,
.primary-cta,
.cta-primary,
.hero-cta,
a[href="/signup"].btn,
a[href="/signup"].button {
  background: #356AE6 !important;
  color: #FFFFFF !important;
  border-color: #356AE6 !important;

  box-shadow:
    0 4px 12px rgba(53,106,230,.18) !important;
}

a.btn-primary:hover,
button.btn-primary:hover,
.primary-btn:hover,
.primary-cta:hover,
.cta-primary:hover,
.hero-cta:hover {
  background: #2C5DCC !important;
  border-color: #2C5DCC !important;
}


/* ──────────────────────────────────────────────────────────
   SECONDARY CTAs
   ────────────────────────────────────────────────────────── */

.btn-secondary,
.secondary-btn,
.secondary-cta {
  background: #FFFFFF !important;
  color: #29496F !important;
  border-color: #C9D8EA !important;
}


/* ──────────────────────────────────────────────────────────
   BRAND / HIGHLIGHT ELEMENTS
   ────────────────────────────────────────────────────────── */

.badge,
.tag,
.pill,
.eyebrow,
.kicker {
  border-color: #D3DEE8;
}

.brand-badge,
.highlight-badge,
.eyebrow,
.kicker {
  background: #FFF6E5 !important;
  border-color: #F3D194 !important;
  color: #B86E00 !important;
}


/* ──────────────────────────────────────────────────────────
   MARKET / RESEARCH INFORMATION
   ────────────────────────────────────────────────────────── */

.metric,
.stat,
.stock-stat,
.market-stat,
.research-stat,
.score-box {
  background: #EEF3F8 !important;
  border-color: #D6E0EA !important;
}


/* Informational explanation */

.insight,
.explanation,
.summary-box,
.research-summary,
.ai-summary {
  background: #EAF1FA !important;
  border-color: #C9D8EA !important;
}


/* ──────────────────────────────────────────────────────────
   FINANCIAL SEMANTICS
   ────────────────────────────────────────────────────────── */

.positive,
.bullish,
.up,
.gain,
.buy {
  color: #268A4A !important;
}

.negative,
.bearish,
.down,
.loss,
.sell,
.risk {
  color: #C9433E !important;
}

.positive-box,
.bull-case,
.upside-box {
  background: #EFF9F2 !important;
  border-color: #C9E8D2 !important;
}

.negative-box,
.bear-case,
.risk-box,
.downside-box {
  background: #FFF2F1 !important;
  border-color: #F0CECB !important;
}


/* ──────────────────────────────────────────────────────────
   TABLES
   ────────────────────────────────────────────────────────── */

table {
  border-color: #D8E1EA !important;
}

thead,
thead tr,
th {
  background: #E9EFF6 !important;
  color: #354A61 !important;
  border-color: #D4DEE9 !important;
}

td {
  border-color: #E4EAF0 !important;
}

tbody tr:nth-child(even) {
  background: #FAFBFC;
}

tbody tr:hover {
  background: #EDF3FA !important;
}


/* ──────────────────────────────────────────────────────────
   INPUTS / SEARCH
   ────────────────────────────────────────────────────────── */

input,
select,
textarea,
.search-input,
.search-box {
  background: #FFFFFF !important;
  color: #18283B !important;
  border-color: #C9D4DF !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: #7EA4F2 !important;
  box-shadow: 0 0 0 3px rgba(53,106,230,.10);
}


/* ──────────────────────────────────────────────────────────
   LINKS
   ────────────────────────────────────────────────────────── */

main a:not(.btn):not(.button):not(.cta) {
  color: #315FAD;
}


/* ──────────────────────────────────────────────────────────
   FOOTER
   ────────────────────────────────────────────────────────── */

footer,
.site-footer {
  background: #E9EFF5 !important;
  color: #52667B !important;
  border-color: #D4DEE8 !important;
}

footer a,
.site-footer a {
  color: #354F70 !important;
}


/* ──────────────────────────────────────────────────────────
   MOBILE
   ────────────────────────────────────────────────────────── */

@media (max-width: 760px) {

  html,
  body {
    background: #FFFFFF !important;
  }

  .hero,
  .hero-section,
  .home-hero,
  .landing-hero {
    background:
      linear-gradient(
        180deg,
        #FFFFFF 0%,
        #F5F8FC 100%
      ) !important;
  }

  .card,
  .feature-card,
  .research-card,
  .stock-card,
  .sector-card,
  .compare-card {
    box-shadow: none !important;
    border-color: #DCE4EC !important;
  }

}


/* End INNELLIS_PUBLIC_MARKETING_LIGHT_V1 */


/* =========================================================
   INNELLIS_PUBLIC_MARKETING_LIGHT_V2
   Navigation + stock analysis tab refinement
   ========================================================= */


/*
 * The legacy stock template uses a global `nav` selector
 * with a dark background.
 *
 * Public Light V2 deliberately separates:
 *
 * 1. Site navigation
 * 2. Analysis section tabs
 */


/* ──────────────────────────────────────────────────────────
   MAIN PUBLIC SITE NAVIGATION
   ────────────────────────────────────────────────────────── */

body > nav:not(.page-tabs),
body > #top-sub-bar + nav:not(.page-tabs) {
  background: rgba(255,255,255,.97) !important;
  border-bottom: 1px solid #D7E0E9 !important;

  box-shadow:
    0 1px 3px rgba(24,40,59,.045) !important;

  backdrop-filter: blur(12px);
}


/* Innellis wordmark */

body > nav:not(.page-tabs) .nav-logo,
body > #top-sub-bar + nav:not(.page-tabs) .nav-logo {
  color: #B96F00 !important;
}


/* Standard public navigation links */

body > nav:not(.page-tabs) .nav-links a,
body > #top-sub-bar + nav:not(.page-tabs) .nav-links a {
  color: #52667B !important;
  background: transparent !important;
}

body > nav:not(.page-tabs) .nav-links a:hover,
body > #top-sub-bar + nav:not(.page-tabs) .nav-links a:hover {
  color: #18283B !important;
  background: #EEF3F8 !important;
}


/*
 * Keep Open Terminal as the distinctive Innellis conversion CTA.
 */

body > nav:not(.page-tabs) .nav-cta,
body > #top-sub-bar + nav:not(.page-tabs) .nav-cta {
  background: #F0A000 !important;
  color: #172033 !important;
  border: 1px solid #E99A00 !important;

  box-shadow:
    0 3px 9px rgba(231,147,0,.16);
}

body > nav:not(.page-tabs) .nav-cta:hover,
body > #top-sub-bar + nav:not(.page-tabs) .nav-cta:hover {
  background: #E79300 !important;
  color: #172033 !important;
}


/* ──────────────────────────────────────────────────────────
   STOCK PAGE ANALYSIS NAVIGATION
   ────────────────────────────────────────────────────────── */

/*
 * page-tabs is also a <nav>, so undo the legacy global
 * nav background / sticky presentation.
 */

nav.page-tabs {
  position: static !important;
  top: auto !important;
  z-index: auto !important;

  background: #FFFFFF !important;

  border:
    1px solid #D7E0E9 !important;

  border-radius: 6px !important;

  margin-bottom: 28px !important;

  padding:
    0 8px !important;

  box-shadow:
    0 2px 7px rgba(24,40,59,.035) !important;

  backdrop-filter: none !important;
}


/* Individual analysis tabs */

nav.page-tabs .page-tab {
  color: #5B6E83 !important;

  background:
    transparent !important;

  border-bottom:
    2px solid transparent !important;

  padding:
    12px 16px !important;
}


/* Hover is intentionally subtle */

nav.page-tabs .page-tab:hover {
  color: #29496F !important;

  background:
    #F4F7FA !important;
}


/*
 * Active research section:
 * blue indicates interaction / information;
 * amber remains a small brand accent.
 */

nav.page-tabs .page-tab.active {
  color: #315FAD !important;

  background:
    #EEF4FC !important;

  border-bottom-color:
    #E79300 !important;

  font-weight: 600;
}


/* ──────────────────────────────────────────────────────────
   STOCK IDENTITY PANEL
   ────────────────────────────────────────────────────────── */

/*
 * Give the top stock identity block slightly stronger
 * separation from the canvas.
 */

.stock-header,
.stock-hero,
.stock-summary,
.company-header {
  background: #FFFFFF !important;

  border-color: #D5DFE9 !important;

  box-shadow:
    0 2px 5px rgba(24,40,59,.035),
    0 12px 28px rgba(24,40,59,.055) !important;
}


/* ──────────────────────────────────────────────────────────
   BREADCRUMB
   ────────────────────────────────────────────────────────── */

.breadcrumb {
  color: #718297 !important;
}

.breadcrumb a {
  color: #64788E !important;
}

.breadcrumb a:hover {
  color: #315FAD !important;
}


/* ──────────────────────────────────────────────────────────
   MOBILE
   ────────────────────────────────────────────────────────── */

@media (max-width: 760px) {

  /*
   * Preserve the intentionally compact SEO mobile header.
   * Only remove the old dark color.
   */

  body > nav:not(.page-tabs),
  body > #top-sub-bar + nav:not(.page-tabs) {
    background: #FFFFFF !important;
    box-shadow: none !important;
  }


  /*
   * Analysis pills continue horizontal scrolling.
   */

  nav.page-tabs {
    border-left: 0 !important;
    border-right: 0 !important;

    border-radius: 0 !important;

    padding:
      0 4px !important;

    box-shadow: none !important;

    overflow-x: auto !important;

    -webkit-overflow-scrolling:
      touch;
  }

  nav.page-tabs .page-tab {
    flex: 0 0 auto;
    padding: 11px 13px !important;
  }

}


/* End INNELLIS_PUBLIC_MARKETING_LIGHT_V2 */
