/* =============================================================
   VedicSagePublic.css
   Public Home corporate-theme reference (opt-in, Home BODY only)
   Scoped under .vs-public-home. Does NOT load on Login/Register
   (those use Layout = null) or other public pages until they opt in.
   Corporate token VALUES mirror VedicSageTheme.css but are scoped
   here to avoid the shared data-layout="topnav" collision.
   ============================================================= */

/* ---------- Public Home tokens (scoped) ---------- */
.vs-public-home {
    --vs-navy-deep: #0E2A47;
    --vs-navy-royal: #123B68;
    --vs-gold: #C89A3D;
    --vs-gold-dark: #A87F2E;
    --vs-gold-surface: #F5EDD8;
    --vs-bg-blue-grey: #E8EEF6;
    --vs-text-navy-dark: #0A1F38;
    --vs-text-muted: #555770;
    --vs-border: #D4D8E2;
}

/* =============================================================
   HOME SHELL / SECTION RHYTHM
   ============================================================= */
.vs-public-home .vs-hero { background-color: #ffffff; }
.vs-public-home .vs-capabilities { background-color: #ffffff; }
.vs-public-home .vs-proof { background-color: #ffffff; }
.vs-public-home .vs-video { background-color: #ffffff; }
.vs-public-home .vs-market { background-color: #ffffff; }
.vs-public-home .vs-lang { background-color: #F6F8FB; }
.vs-public-home .vs-learn { background-color: #ffffff; }
.vs-public-home .vs-testi { background-color: #F6F8FB; }
.vs-public-home .vs-founder { background-color: #FBF6EC; }
.vs-public-home .vs-pricing { background-color: #ffffff; }

/* =============================================================
   HERO
   ============================================================= */
.vs-public-home .vs-hero-eyebrow {
    background-color: var(--vs-gold-surface);
    border: 1px solid var(--vs-gold-dark);
    color: var(--vs-text-navy-dark);
}

.vs-public-home .vs-home-h1 {
    color: var(--vs-navy-deep);
}

/* Restrained corporate highlight: royal navy, no cyan gradient.
   Neutralize the inline gradient utilities from _SharedPageScripts. */
.vs-public-home .vs-h1-highlight {
    color: var(--vs-navy-royal);
    -webkit-text-fill-color: var(--vs-navy-royal);
    background: none;
    -webkit-background-clip: border-box;
    background-clip: border-box;
    border-bottom: 2px solid var(--vs-gold);
    display: inline-block;
    padding-bottom: 2px;
}

.vs-public-home .vs-hero .lead,
.vs-public-home .vs-hero p {
    color: var(--vs-text-navy-dark);
}

.vs-public-home .vs-hero-cta {
    background-color: var(--vs-navy-royal) !important;
    border-color: var(--vs-navy-royal) !important;
    color: #ffffff !important;
    box-shadow: 0 1px 2px rgba(14, 42, 71, 0.18);
}
.vs-public-home .vs-hero-cta:hover,
.vs-public-home .vs-hero-cta:focus {
    background-color: var(--vs-navy-deep) !important;
    border-color: var(--vs-gold) !important;
    color: #ffffff !important;
}

.vs-public-home .vs-video-cta {
    color: var(--vs-navy-deep) !important;
}
.vs-public-home .vs-video-cta:hover,
.vs-public-home .vs-video-cta:focus {
    color: var(--vs-navy-royal) !important;
}
.vs-public-home .vs-video-cta .icon-circle {
    border-color: var(--vs-gold-dark) !important;
    color: var(--vs-gold-dark) !important;
}

/* Subtle warm glow instead of generic blue soft glow */
.vs-public-home .vs-hero .bg-gradient-primary-soft {
    background: var(--vs-gold-surface) !important;
}

/* Trust checks: KEEP semantic success/green — no change needed,
   declared explicitly so future edits don't recolor them. */
.vs-public-home .vs-hero .text-success { color: #198754 !important; }

/* =============================================================
   CAPABILITY / FEATURE GRID  +  LEARNING (shared hs-* grammar)
   ============================================================= */
.vs-public-home .hs-tool-card {
    background-color: #ffffff;
    border: 1px solid var(--vs-border);
    box-shadow: 0 1px 3px rgba(14, 42, 71, 0.06);
}
/* Tool cards are native anchors: suppress default link underline, keep focus ring */
.vs-public-home a.hs-tool-card { text-decoration: none; }
.vs-public-home .hs-tool-name { color: var(--vs-text-navy-dark); }
.vs-public-home .hs-tool-desc { color: var(--vs-text-muted); }

/* Group labels: navy text + restrained gold accent */
.vs-public-home .hs-group-label {
    color: var(--vs-navy-royal);
    border-left: 3px solid var(--vs-gold);
    padding-left: 8px;
}

/* Decorative icon normalization: two-family corporate system */
.vs-public-home .hs-icon-blue,
.vs-public-home .hs-icon-teal,
.vs-public-home .hs-icon-green {
    background-color: #EEF2F8;
    color: var(--vs-navy-royal);
}
.vs-public-home .hs-icon-amber,
.vs-public-home .hs-icon-purple,
.vs-public-home .hs-icon-coral,
.vs-public-home .hs-icon-pink {
    background-color: var(--vs-gold-surface);
    color: var(--vs-gold-dark);
}

/* =============================================================
   PROOF / PERFORMANCE METRICS
   ============================================================= */
.vs-public-home .eyebrow-heading {
    color: var(--vs-gold-dark) !important;
    font-weight: 700;
    letter-spacing: 1.2px;
}
.vs-public-home .vs-proof h3 { color: var(--vs-navy-deep) !important; }
.vs-public-home .vs-proof .h4 { color: var(--vs-navy-deep) !important; }
.vs-public-home .vs-proof .fa-check-circle { color: var(--vs-navy-royal) !important; }
.vs-public-home .vs-proof .fa-star { color: var(--vs-gold) !important; }
.vs-public-home .vs-proof .fa-bolt { color: var(--vs-gold-dark) !important; }

/* =============================================================
   PRODUCT EXPLANATION / VIDEO
   ============================================================= */
.vs-public-home .vs-video h2 { color: var(--vs-navy-deep); }

.vs-public-home .vs-mark-gold {
    background-color: var(--vs-gold-surface) !important;
    color: var(--vs-text-navy-dark) !important;
}

.vs-public-home .vs-step {
    background-color: var(--vs-gold-surface) !important;
    color: var(--vs-gold-dark) !important;
}
.vs-public-home .vs-video h4,
.vs-public-home .vs-video h5 { color: var(--vs-navy-deep); }
.vs-public-home .vs-video .text-muted { color: var(--vs-text-muted) !important; }

/* =============================================================
   AI INFRASTRUCTURE — PRIMARY DARK ANCHOR
   ============================================================= */
.vs-public-home .vs-ai-band {
    background-color: var(--vs-navy-deep);
    color: #E6EAF2;
}
.vs-public-home .vs-ai-band h2,
.vs-public-home .vs-ai-band h4,
.vs-public-home .vs-ai-band h5 { color: #ffffff; }
.vs-public-home .vs-ai-band p,
.vs-public-home .vs-ai-band .text-muted {
    color: #C9D2E3 !important;
}
.vs-public-home .vs-ai-eyebrow {
    color: var(--vs-gold) !important;
}
.vs-public-home .vs-ai-band .vs-ai-icon {
    color: var(--vs-gold) !important;
}
/* Screenshot floats clearly on navy */
.vs-public-home .vs-ai-band .rounded-4.shadow-lg {
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
}

/* =============================================================
   MARKETPLACE / CLIENT DISCOVERY
   ============================================================= */
.vs-public-home .vs-market .hs-feature-card {
    border-left-color: var(--vs-navy-royal) !important;
}
.vs-public-home .vs-market .hs-feature-card-teal,
.vs-public-home .vs-market .hs-feature-card-purple,
.vs-public-home .vs-market .hs-feature-card-amber {
    border-left-color: var(--vs-gold) !important;
}
.vs-public-home .vs-market .hs-feature-title { color: var(--vs-text-navy-dark); }
.vs-public-home .vs-market .hs-feature-desc { color: var(--vs-text-muted); }
.vs-public-home .vs-market .hs-title { color: var(--vs-navy-deep); }
.vs-public-home .vs-market .text-primary { color: var(--vs-navy-royal) !important; }

/* Protected functional states — preserved, not recolored */
.vs-public-home .vs-market .hs-live-badge { background: #edf7e3; color: #3B6D11; border-color: #97C459; }
.vs-public-home .vs-market .hs-verified-badge { background: #e8f2fd; color: #185FA5; border-color: #85B7EB; }
.vs-public-home .vs-market .hs-price-label { color: var(--vs-navy-royal); }

/* =============================================================
   MULTILINGUAL
   ============================================================= */
.vs-public-home .vs-lang .hs-title { color: var(--vs-navy-deep); }
.vs-public-home .vs-lang .hs-lang-btn {
    background-color: #ffffff;
    border: 1px solid var(--vs-border);
    color: var(--vs-text-muted);
}
.vs-public-home .vs-lang .hs-lang-btn-active {
    background-color: var(--vs-gold-surface);
    border-color: var(--vs-gold-dark);
    color: var(--vs-text-navy-dark);
    font-weight: 600;
}
.vs-public-home .vs-lang .hs-stat-num { color: var(--vs-navy-deep); }
.vs-public-home .vs-lang .hs-stat-lbl { color: var(--vs-text-muted); }

/* Multilingual statistic surfaces: clear white cards on the soft section bg */
.vs-public-home .vs-lang .hs-stat-box {
    background-color: #ffffff;
    border: 1px solid var(--vs-border);
    border-top: 3px solid var(--vs-gold-dark);
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(14, 42, 71, 0.06);
}
.vs-public-home .vs-lang .hs-stat-box .hs-stat-num { font-weight: 700; }
.vs-public-home .vs-lang .hs-stat-box .hs-stat-lbl { color: var(--vs-text-muted); }

/* =============================================================
   TESTIMONIALS
   ============================================================= */
.vs-public-home .vs-testi .card {
    background-color: #ffffff !important;
    border: 1px solid var(--vs-border) !important;
}
.vs-public-home .vs-testi .card .text-dark { color: var(--vs-text-navy-dark) !important; }
.vs-public-home .vs-testi .text-muted { color: var(--vs-text-muted) !important; }
/* Stars: KEEP warm gold semantics */
.vs-public-home .vs-testi .text-warning { color: #E0A800 !important; }
/* Decorative avatar surfaces normalized (data unchanged) */
.vs-public-home .vs-testi .avatar.bg-primary { background-color: var(--vs-navy-deep) !important; }
.vs-public-home .vs-testi .avatar.bg-info { background-color: var(--vs-navy-royal) !important; }
.vs-public-home .vs-testi .avatar.bg-success { background-color: var(--vs-gold-dark) !important; }

/* =============================================================
   FOUNDER / COMPANY CREDIBILITY
   ============================================================= */
.vs-public-home .vs-founder h2 { color: var(--vs-navy-deep); }
.vs-public-home .vs-founder .text-muted { color: var(--vs-text-muted) !important; }
.vs-public-home .vs-founder .text-primary { color: var(--vs-gold-dark) !important; }
.vs-public-home .vs-founder a.btn-link { color: var(--vs-navy-royal) !important; }

/* =============================================================
   PRICING (inline hs-* on Home)
   ============================================================= */
.vs-public-home .vs-pricing .hs-title { color: var(--vs-navy-deep); }
.vs-public-home .vs-pricing .hs-subtitle { color: var(--vs-text-muted); }
.vs-public-home .vs-pricing .hs-tier-card { background-color: #ffffff; border: 1px solid var(--vs-border); }
.vs-public-home .vs-pricing .hs-tier-name { color: var(--vs-text-muted); }
.vs-public-home .vs-pricing .hs-tier-price { color: var(--vs-navy-deep); }
.vs-public-home .vs-pricing .hs-tier-desc { color: var(--vs-text-muted); }
.vs-public-home .vs-pricing .hs-tier-row { color: var(--vs-text-navy-dark); }
/* Featured plan: gold accent, NOT solid blue */
.vs-public-home .vs-pricing .hs-tier-card-featured {
    border: 2px solid var(--vs-gold) !important;
    background-color: #FFFBF2;
}
.vs-public-home .vs-pricing .hs-popular-badge {
    background-color: var(--vs-gold-surface);
    color: var(--vs-gold-dark);
    border: 1px solid var(--vs-gold-dark);
}
/* Preserve semantic green checks */
.vs-public-home .vs-pricing .hs-tier-row .ti-check,
.vs-public-home .vs-pricing .hs-tier-row i { color: #3B6D11; }
.vs-public-home .vs-pricing .hs-tier-row i { color: var(--vs-gold-dark); }

/* Free CTA: corporate outline */
.vs-public-home .vs-pricing-free-btn {
    background-color: transparent !important;
    border-color: var(--vs-gold-dark) !important;
    color: var(--vs-navy-deep) !important;
}
.vs-public-home .vs-pricing-free-btn:hover,
.vs-public-home .vs-pricing-free-btn:focus {
    background-color: var(--vs-navy-deep) !important;
    border-color: var(--vs-navy-deep) !important;
    color: #ffffff !important;
}
/* Professional CTA: royal navy */
.vs-public-home .vs-pricing-pro-btn {
    background-color: var(--vs-navy-royal) !important;
    border-color: var(--vs-navy-royal) !important;
    color: #ffffff !important;
}
.vs-public-home .vs-pricing-pro-btn:hover,
.vs-public-home .vs-pricing-pro-btn:focus {
    background-color: var(--vs-navy-deep) !important;
    border-color: var(--vs-gold) !important;
    color: #ffffff !important;
}
.vs-public-home .vs-pricing .text-primary { color: var(--vs-navy-royal) !important; }

/* =============================================================
   FINAL CTA BAND
   ============================================================= */
.vs-public-home .vs-final-cta {
    background-color: var(--vs-navy-deep) !important;
}
.vs-public-home .vs-final-cta h2 { color: #ffffff; }
.vs-public-home .vs-final-cta .text-white-50 { color: #C9D2E3 !important; }
.vs-public-home .vs-final-cta-btn {
    background-color: #ffffff !important;
    border-color: #ffffff !important;
    color: var(--vs-navy-deep) !important;
}
.vs-public-home .vs-final-cta-btn:hover,
.vs-public-home .vs-final-cta-btn:focus {
    background-color: var(--vs-gold-surface) !important;
    border-color: var(--vs-gold) !important;
    color: var(--vs-navy-deep) !important;
}

/* =============================================================
   ACCESSIBILITY — visible focus rings (Home only)
   ============================================================= */
.vs-public-home a:focus-visible,
.vs-public-home button:focus-visible,
.vs-public-home .btn:focus-visible,
.vs-public-home [data-bs-toggle="modal"]:focus-visible {
    outline: 2px solid var(--vs-gold-dark);
    outline-offset: 2px;
}
.vs-public-home .vs-hero-cta:focus-visible,
.vs-public-home .vs-pricing-pro-btn:focus-visible,
.vs-public-home .vs-pricing-free-btn:focus-visible,
.vs-public-home .vs-final-cta-btn:focus-visible {
    box-shadow: 0 0 0 0.2rem rgba(200, 154, 61, 0.40);
}

/* =============================================================
   SHARED PUBLIC FOOTER (unauthorized layout) — VedicSage corporate navy/gold
   Intentionally NOT scoped under .vs-public-home, because the shared footer
   lives in _LayoutUnauthorized.cshtml outside the Home wrapper and must apply
   to EVERY public page. Corporate tokens are scoped to .vs-public-home, so the
   literal hex values are used here (#0E2A47 navy, #C89A3D gold) to avoid an
   unresolved var(). The .vs-public-footer class is added ONLY to the public
   footer; the authenticated _Footer.cshtml does not use it, so it is untouched.
   ============================================================= */
.vs-public-footer {
    background-color: #0E2A47;
    color: #C7D2E0;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.vs-public-footer h5 { color: #ffffff; }

.vs-public-footer .vs-footer-brand-logo {
    display: block;
    width: auto;
    height: 80px;
    max-width: 100%;
}

/* Brand "VedicSage.ai" in the copyright line */
.vs-public-footer strong { color: #C89A3D; }

/* Footer navigation / contact links */
.vs-public-footer .nav-link {
    color: #C7D2E0;
    font-size: 14px;
}
.vs-public-footer .nav-link:hover,
.vs-public-footer .nav-link:focus {
    color: #C89A3D;
}

/* Social buttons — translucent surface on navy, no charcoal circles */
.vs-public-footer .btn-dark {
    background-color: rgba(255, 255, 255, 0.10);
    border-color: rgba(255, 255, 255, 0.18);
    color: #E6EAF2;
}
.vs-public-footer .btn-dark:hover,
.vs-public-footer .btn-dark:focus {
    background-color: rgba(255, 255, 255, 0.18);
    color: #ffffff;
}

/* Bottom legal row */
.vs-public-footer .border-dark-subtle {
    border-color: rgba(255, 255, 255, 0.12);
}
.vs-public-footer .text-muted {
    color: #9AA7B8;
}
.vs-public-footer a.text-muted:hover,
.vs-public-footer a.text-muted:focus {
    color: #ffffff;
}

@media (max-width: 767.98px) {
    .vs-public-footer .vs-footer-brand-logo {
        height: 68px;
    }
}

/* =============================================================
   SHARED PUBLIC HEADER (unauthorized layout) — VedicSage corporate navy/gold
   Scoped under .vs-public-header (NOT .vs-public-home) so it applies to the
   shared header on every public page. All rules are explicitly scoped; this
   block does NOT globally override .navbar / .nav-link / .btn / .btn-primary / a.
   Corporate token VALUES are used as literal hex because the tokens are scoped
   to .vs-public-home and would not resolve here (.vs-public-header is outside
   that wrapper). #0E2A47 = navy-deep, #C89A3D = gold, #C7D2E0 = light border.
   ============================================================= */
.vs-public-header .navbar {
    border-bottom: 1px solid #E6EAF2;
}

/* Brand logo — corporate horizontal logo (WebP + PNG fallback via <picture>) */
.vs-public-header .vs-public-header-logo {
    height: 46px;
    width: auto;
    object-fit: contain;
    display: block;
}

@media (max-width: 767.98px) {
    .vs-public-header .vs-public-header-logo {
        height: 36px;
    }
}

/* Navigation links — navy, gold underline accent */
.vs-public-header .nav-link {
    color: #0E2A47;
    position: relative;
}
.vs-public-header .nav-link:hover,
.vs-public-header .nav-link:focus {
    color: #0A1F38;
}
.vs-public-header .nav-link:hover::after,
.vs-public-header .nav-link:focus::after,
.vs-public-header .nav-link.active::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -2px;
    height: 2px;
    background-color: #C89A3D;
}
/* Standing highlighted nav item: gold TEXT accent only. The previous standing
   gold underline was visually identical to the hover/active underline and read
   as "active" on every page. Active state is now URL-driven (layout script). */
.vs-public-header .nav-highlight .nav-link {
    font-weight: 600;
    color: #A87F2E;
}
.vs-public-header .nav-highlight .nav-link:hover,
.vs-public-header .nav-highlight .nav-link:focus {
    color: #8F6B24;
}

/* Get Started — distinctive PUBLIC conversion CTA: gold + navy text */
.vs-public-header .vs-public-cta {
    background-color: #C89A3D;
    border: 1px solid #C89A3D;
    color: #0E2A47;
    font-weight: 700;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.vs-public-header .vs-public-cta:hover,
.vs-public-header .vs-public-cta:focus {
    background-color: #0E2A47;
    border-color: #C89A3D;
    color: #ffffff;
}
.vs-public-header .vs-public-cta:focus-visible {
    outline: 2px solid #C89A3D;
    outline-offset: 2px;
    box-shadow: 0 0 0 0.2rem rgba(200, 154, 61, 0.40);
}

/* Login — secondary action: restrained navy / outline (mobile utility bar) */
.vs-public-header .mobile-login-btn {
    background-color: #ffffff;
    color: #0E2A47;
    border: 1px solid #C7D2E0;
}
.vs-public-header .mobile-login-btn:hover,
.vs-public-header .mobile-login-btn:focus {
    background-color: #F5EDD8;
    color: #0E2A47;
    border-color: #C89A3D;
}
.vs-public-header .mobile-login-btn:focus-visible {
    outline: 2px solid #C89A3D;
    outline-offset: 2px;
}

/* Language selector — keep neutral navy, remove Bootstrap blue inside dropdown */
.vs-public-header .topbar-link {
    color: #0E2A47;
}
.vs-public-header .dropdown-item .text-primary {
    color: #0E2A47;
}
.vs-public-header .dropdown-item.active,
.vs-public-header .dropdown-item:active {
    color: #0E2A47;
    background-color: #F5EDD8;
}