/* =====================================================================
   Risers — brand stylesheet
   Palette:
     --riser-ink:      #0B1F2A  (near-black teal, headings)
     --riser-teal:      #0E6E5C (primary brand — growth/funding)
     --riser-teal-dark: #084C40 (hover/active)
     --riser-gold:      #D4A24C (accent — "raise" highlight, sparingly)
     --riser-mist:       #F3F7F6 (page background)
     --riser-line:       #E1E8E6 (hairlines/borders)
   Type:
     Display: "Manrope" (700/800) — confident, geometric, works at large sizes
     Body/UI: "Inter" — neutral workhorse for forms & data-heavy tables
   Signature: an ascending "riser step" motif (staggered horizontal bars)
   used in the hero and as a loading/empty-state device — literalizing
   the idea of a startup's funding stack rising step by step.
   ===================================================================== */

:root {
    --riser-ink: #0B1F2A;
    --riser-teal: #0E6E5C;
    --riser-teal-dark: #084C40;
    --riser-teal-soft: #E4F2EF;
    --riser-gold: #D4A24C;
    --riser-mist: #F3F7F6;
    --riser-line: #E1E8E6;
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--riser-ink);
    background-color: var(--riser-mist);
}

h1, h2, h3, h4, .display-font {
    font-family: 'Manrope', 'Inter', sans-serif;
    font-weight: 800;
    color: var(--riser-ink);
    letter-spacing: -0.01em;
}

a { color: var(--riser-teal); }
a:hover { color: var(--riser-teal-dark); }

/* ---- Navbar ---- */
.brand-logo {
    font-family: 'Manrope', sans-serif;
    font-weight: 800;
    font-size: 1.4rem;
    color: var(--riser-ink) !important;
}
.brand-dot { color: var(--riser-gold); }

.navbar {
    border-bottom: 1px solid var(--riser-line);
}
.navbar-nav .nav-link {
    color: var(--riser-ink);
    font-weight: 600;
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
    color: var(--riser-teal);
}
.navbar-toggler {
    border: 1px solid var(--riser-line);
    color: var(--riser-ink);
}
.navbar-toggler:focus {
    box-shadow: 0 0 0 0.2rem rgba(14, 110, 92, 0.15);
}
.navbar-collapse {
    background: #fff;
    border-radius: 14px;
    padding: 1rem;
    margin-top: .5rem;
    border: 1px solid var(--riser-line);
}
@media (min-width: 992px) {
    .navbar-collapse {
        background: transparent;
        border: 0;
        padding: 0;
        margin-top: 0;
    }
}
.dropdown-menu {
    border: 1px solid var(--riser-line);
    border-radius: 12px;
    box-shadow: 0 12px 24px rgba(11, 31, 42, 0.08);
}
.dropdown-item {
    color: var(--riser-ink);
}
.dropdown-item:hover,
.dropdown-item:focus {
    background: var(--riser-teal-soft);
    color: var(--riser-teal-dark);
}

.btn-brand, .btn-primary {
    background-color: var(--riser-teal);
    border-color: var(--riser-teal);
    color: #fff;
}
.btn-brand:hover, .btn-primary:hover {
    background-color: var(--riser-teal-dark);
    border-color: var(--riser-teal-dark);
    color: #fff;
}
.btn-outline-brand {
    color: var(--riser-teal);
    border-color: var(--riser-teal);
}
.btn-outline-brand:hover {
    background-color: var(--riser-teal);
    color: #fff;
}
.text-brand { color: var(--riser-teal) !important; }
.bg-brand { background-color: var(--riser-teal) !important; color: #fff !important; }
.nav-pills .nav-link.active {
    background-color: var(--riser-teal) !important;
    color: #fff !important;
}
.nav-pills .nav-link.active:hover,
.nav-pills .nav-link.active:focus {
    color: #fff !important;
}

/* ---- Hero ---- */
.hero {
    background: linear-gradient(180deg, #ffffff 0%, var(--riser-mist) 100%);
    padding: 5rem 0 4rem;
    position: relative;
    overflow: hidden;
}
.hero h1 { font-size: clamp(2.2rem, 4vw, 3.4rem); line-height: 1.08; }
.hero .lead { font-size: 1.15rem; color: #47585B; max-width: 34rem; }

/* Signature: ascending riser-step motif */
.riser-steps {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    height: 220px;
}
.riser-steps .step {
    background: linear-gradient(180deg, var(--riser-teal) 0%, var(--riser-teal-dark) 100%);
    border-radius: 10px 10px 0 0;
    width: 44px;
    animation: rise 900ms cubic-bezier(.2,.7,.3,1) both;
}
.riser-steps .step:nth-child(1) { height: 40%;  animation-delay: 0ms; }
.riser-steps .step:nth-child(2) { height: 62%;  animation-delay: 90ms; background: linear-gradient(180deg, #14876F 0%, var(--riser-teal) 100%);}
.riser-steps .step:nth-child(3) { height: 82%;  animation-delay: 180ms; }
.riser-steps .step:nth-child(4) { height: 100%; animation-delay: 270ms; background: linear-gradient(180deg, var(--riser-gold) 0%, #B98536 100%);}
@keyframes rise {
    from { transform: scaleY(0); transform-origin: bottom; opacity: 0; }
    to   { transform: scaleY(1); transform-origin: bottom; opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .riser-steps .step { animation: none; }
}

/* ---- Feature / stat cards ---- */
.card { border: 1px solid var(--riser-line); border-radius: 14px; }
.card.feature-card { transition: transform .15s ease, box-shadow .15s ease; }
.card.feature-card:hover { transform: translateY(-3px); box-shadow: 0 12px 24px rgba(11,31,42,.08); }
.icon-chip {
    width: 48px; height: 48px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center;
    background: var(--riser-teal-soft); color: var(--riser-teal); font-size: 1.2rem;
}

.stat-card { border-radius: 14px; }
.stat-card .stat-value { font-family: 'Manrope', sans-serif; font-weight: 800; font-size: 2rem; color: var(--riser-ink); }
.stat-card .stat-label { color: #667; font-size: .85rem; text-transform: uppercase; letter-spacing: .04em; }

/* ---- Idea cards (investor feed) ---- */
.idea-card { border-radius: 14px; }
.idea-card .sector-chip {
    font-size: .72rem; text-transform: uppercase; letter-spacing: .05em;
    background: var(--riser-teal-soft); color: var(--riser-teal-dark);
    padding: .25rem .6rem; border-radius: 999px; font-weight: 600;
}
.idea-card .funding-amount { font-family: 'Manrope', sans-serif; font-weight: 800; color: var(--riser-ink); }

/* ---- Forms ---- */
.form-outline .form-control:focus ~ .form-label,
.form-outline .form-control:focus { border-color: var(--riser-teal); }

.form-outline {
    position: relative;
    margin-bottom: 1.5rem;
    width: 100%;
}

.auth-card .form-outline {
    width: 100%;
}

.form-control {
    display: block;
    width: 100%;
    padding: .75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: var(--riser-ink);
    background-color: #fff;
    border: 1px solid var(--riser-line);
    border-radius: .375rem;
}

.form-control::placeholder {
    color: #999;
    opacity: 1;
}

.form-control:focus {
    color: var(--riser-ink);
    background-color: #fff;
    border-color: var(--riser-teal);
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(14, 110, 92, 0.15);
}

textarea.form-control {
    resize: vertical;
    min-height: 120px;
    padding: .75rem;
}

.form-select {
    display: block;
    width: 100%;
    padding: .75rem;
    font-size: 1rem;
    color: var(--riser-ink);
    background-color: #fff;
    border: 1px solid var(--riser-line);
    border-radius: .375rem;
}

.form-select:focus {
    border-color: var(--riser-teal);
    box-shadow: 0 0 0 0.2rem rgba(14, 110, 92, 0.15);
}

.form-label {
    display: block;
    margin-bottom: .5rem;
    color: var(--riser-ink);
    font-weight: 500;
    font-size: .95rem;
}

.mb-3 {
    margin-bottom: 1rem !important;
}

.mb-4 {
    margin-bottom: 1.5rem !important;
}\n.auth-card { max-width: 460px; margin: 3rem auto; border-radius: 16px; padding: 2rem !important; }

.auth-card form {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.auth-card .form-outline,
.auth-card .mb-3,
.auth-card .mb-4 {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.auth-card .form-control,
.auth-card .form-select,
.auth-card textarea {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* ---- Tables ---- */
.table-risers thead { background: var(--riser-ink); color: #fff; }
.table-risers thead th { border: none; font-weight: 600; font-size: .82rem; text-transform: uppercase; letter-spacing: .03em; }

/* ---- Toasts ---- */
.toast-stack { position: fixed; top: 84px; right: 16px; z-index: 1090; display: flex; flex-direction: column; gap: .5rem; }

/* ---- Footer ---- */
.site-footer { border-top: 1px solid var(--riser-line); background: #fff; }

/* ---- Empty states (riser-step motif, quiet variant) ---- */
.empty-state { text-align: center; padding: 3rem 1rem; color: #667; }
.empty-state .riser-steps { height: 70px; justify-content: center; margin: 0 auto 1.25rem; opacity: .5; }
.empty-state .riser-steps .step { width: 22px; }