/* ============================================================
   landing-base.css
   Global tokens + footer — shared by ALL landing pages.
   Loaded via Views/Landing/_Layout.cshtml alongside styles.css.
   ============================================================ */

/* ── CSS Variables ───────────────────────────────────────── */
:root {
    --bs-body-font-family: 'Inter', sans-serif;
    --color-grey-1000:  #131313;
    --color-grey-900:   #272727;
    --color-grey-800:   #3A3A3A;
    --color-grey-700:   #4E4E4E;
    --color-grey-600:   #6B6B6B;
    --color-grey-500:   #7C7C7C;
    --color-primary-500: #6B4CF3;
    --color-primary-700: #8C50F4;
    --color-primary-800: #884CF3;
    --color-primary-900: #4F2598;
    --color-accent-purple:       #7C3AED;
    --color-accent-purple-light: #6A1EEC;
    --color-light-purple:        #C5A3F4;
    --color-off-white:        #E3EAF5;
    --color-off-white-darker: #EBF0F6;
    --color-card-border:  #DEDEDE;
    --color-light-grey:   #DEDEDE;
    --bg-color:           #F8F9FB;
    --color-dark-purple:  #4F2598;
    --color-section5-text-light: #E3EAF5;
}

/* ── Base Reset ──────────────────────────────────────────── */
body, html {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    font-family: 'Inter', sans-serif;
    background-color: #0c0a1e; /* lavender dark — all landing pages share this base */
    overflow-x: hidden;
}

/* Override Bootstrap's body background so it doesn't bleed through */
body {
    margin: 0;
    padding: 0;
    background-color: #0c0a1e;
    color: #e2e8f0; /* default text to light so it's readable on dark bg */
}

/* ── Dark-theme Bootstrap utility overrides ────────────────
   styles.css (StartBootstrap bundle) does not include Bootstrap's
   full utility layer (.text-muted, .bg-light, .bg-white, etc.).
   Define them here so pages using this CSS sheet render correctly
   on the dark background.
   ─────────────────────────────────────────────────────────── */

/* Section backgrounds — dark variants so alternating sections are
   visually distinguished from the body (#0c0a1e). */
.bg-light { background-color: #1a1831 !important; }
.bg-white { background-color: #13132a !important; }

/* Muted / secondary text — a readable lighter slate-grey */
.text-muted { color: #94a3b8 !important; }

/* Cards — give them a slightly elevated dark surface */
.card {
    background-color: #1e1b40 !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    color: #e2e8f0;
}
.card h3, .card h4, .card h5, .card h6 { color: #f1f5f9; }
.card p.text-muted { color: #94a3b8 !important; }

/* Default headings — light on dark background */
h1:not([class*="text-"]),
h2:not([class*="text-"]),
h3:not([class*="text-"]),
h4:not([class*="text-"]),
h5:not([class*="text-"]),
h6:not([class*="text-"]) { color: #f1f5f9; }

/* Bordered elements */
.border, .border-2 { border-color: rgba(255, 255, 255, 0.12) !important; }

/* Lead text without explicit color */
.lead:not([class*="text-"]) { color: #cbd5e1; }

/* Smooth scroll for all anchor navigation */
html { scroll-behavior: smooth; }

/* ── Bootstrap Navbar Overrides (landing pages only) ────── */
body.landing #mainNav { padding-top:0.25rem; padding-bottom:0.25rem; min-height:48px; background-size:cover; background-position:center; }
body.landing #mainNav .container { padding-top:0.15rem; padding-bottom:0.15rem; align-items:center; display:flex; }
body.landing #mainNav .container a img { max-height:36px !important; height:auto; width:auto; }
body.landing #mainNav .nav-link { font-size:0.9rem; padding-top:.25rem; padding-bottom:.25rem; }
body.landing #mainNav .btn { padding:.28rem .7rem; font-size:.85rem; line-height:1.2; min-height:0; }
body.landing #mainNav .navbar-toggler { padding:.25rem .5rem; }
body.landing #mainNav .navbar-nav { align-items:center; }
body.landing #mainNav .navbar-nav > li .nav-link,
body.landing #mainNav .navbar-nav > li .btn { margin-top:0; margin-bottom:0; }
section[id], div[id].ClientsStrip { scroll-margin-top:80px; }
@media (max-width:576px) {
    body.landing #mainNav .container a img { max-height:30px !important; }
    body.landing #mainNav .nav-link { font-size:0.85rem; }
    body.landing #mainNav .btn { font-size:0.8rem; padding:.22rem .6rem; }
}

/* ============================================================
   Landing Footer  (bt-landing-footer component)
   ============================================================ */
.bt-landing-footer {
    background: #13132a;
    color: #cbd5e1;
    padding: 64px 0 0;
}

.bt-landing-footer-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 32px;
}

.bt-footer-top {
    display: flex;
    gap: 64px;
    flex-wrap: wrap;
    padding-bottom: 48px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.bt-footer-brand-col {
    flex: 2;
    min-width: 220px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.bt-footer-logo {
    height: 36px;
    width: auto;
    filter: brightness(0) invert(1);
    opacity: 0.9;
}

.bt-footer-tagline {
    font-size: 13px;
    color: #94a3b8;
    line-height: 1.65;
    margin: 0;
}

.bt-footer-email {
    font-size: 13px;
    color: #818cf8;
    text-decoration: none;
    transition: color 0.2s;
}

.bt-footer-email:hover { color: #a5b4fc; }

.bt-footer-nav-col {
    flex: 1;
    min-width: 150px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.bt-footer-col-title {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #ffffff;
    margin: 0 0 6px;
}

.bt-footer-nav-col a {
    font-size: 14px;
    color: #94a3b8;
    text-decoration: none;
    transition: color 0.2s;
}

.bt-footer-nav-col a:hover { color: #e2e8f0; }

.bt-footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 0;
    font-size: 13px;
    color: #64748b;
    flex-wrap: wrap;
    gap: 12px;
}

.bt-footer-socials {
    display: flex;
    gap: 16px;
}

.bt-footer-socials a {
    color: #64748b;
    font-size: 18px;
    text-decoration: none;
    transition: color 0.2s;
}

.bt-footer-socials a:hover { color: #818cf8; }

@media (max-width: 768px) {
    .bt-landing-footer { padding-top: 40px; }
    .bt-footer-top { gap: 32px; }
    .bt-footer-brand-col { flex: 1 1 100%; }
    .bt-footer-bottom { justify-content: center; text-align: center; }
    .bt-landing-footer-container { padding: 0 20px; }
}