/* ==========================================================================
   Samhita Engineering — Design System v1
   Reskins the existing Bootstrap-based template to the graphite / paper /
   amber / trace-blue system approved on the homepage mockup.
   Load AFTER bootstrap.min.css and style.css.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
    --se-ink:#10141C;
    --se-ink-2:#171D28;
    --se-hairline-dark:#2A3442;
    --se-paper:#EDF0F4;
    --se-paper-2:#FFFFFF;
    --se-hairline-light:#D6DDE6;
    --se-text-muted-dark:#8B96A6;
    --se-text-muted-light:#55606D;
    --se-amber:#FF9E1B;
    --se-amber-ink:#3A2400;
    --se-trace:#3AA9FF;
    --se-rust:#B5652C;

    /* Bootstrap variable overrides used across the template */
    --primary: var(--se-ink);
    --secondary: var(--se-trace);
    --light: var(--se-paper);
    --dark: var(--se-ink);
}

/* ---------- Base type ---------- */
body{
    font-family:'IBM Plex Sans', sans-serif;
    color:var(--se-ink);
    background:var(--se-paper);
}
h1,h2,h3,h4,h5,h6,
.display-1,.display-2,.display-3,.display-4,.display-5,.display-6{
    font-family:'Space Grotesk', sans-serif !important;
    letter-spacing:-0.01em;
}
.se-mono, .breadcrumb, .btn, .navbar-nav .nav-link{
    font-family:'IBM Plex Mono', monospace;
}

/* ---------- Navbar ---------- */
.sticky-top .navbar,
.container-fluid.sticky-top{
    background:rgba(16,20,28,0.94) !important;
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--se-hairline-dark);
    transition:none !important;
    top:0 !important;
}
.navbar-brand h1{
    font-family:'Space Grotesk', sans-serif !important;
    font-size:19px !important;
    font-weight:600 !important;
}
.navbar .nav-link{
    color:var(--se-text-muted-dark) !important;
    font-size:12.5px;
    letter-spacing:0.05em;
    text-transform:uppercase;
    font-weight:500;
}
.navbar .nav-link:hover,
.navbar .nav-link.active{
    color:#FFFFFF !important;
}

/* ---------- Buttons ---------- */
.btn-primary{
    background:var(--se-amber) !important;
    border-color:var(--se-amber) !important;
    color:var(--se-amber-ink) !important;
    font-weight:600;
    border-radius:2px !important;
}
.btn-primary:hover{
    background:#FFB246 !important;
    border-color:#FFB246 !important;
    color:var(--se-amber-ink) !important;
}
.btn-outline-primary,
.btn-square.border{
    border-color:var(--se-hairline-light) !important;
    color:var(--se-ink) !important;
    border-radius:2px !important;
}
.btn.rounded-pill{
    border-radius:2px !important;
    font-family:'IBM Plex Mono', monospace;
    font-size:11.5px;
    letter-spacing:0.04em;
    text-transform:uppercase;
}
.btn-light{ border-radius:2px !important; }
.back-to-top{
    background:var(--se-amber) !important;
    border-color:var(--se-amber) !important;
    color:var(--se-amber-ink) !important;
}

/* ---------- Hero / inner-page banner ---------- */
.hero-header,
.bg-primary{
    background:var(--se-ink) !important;
}
.hero-header{
    border-bottom:1px solid var(--se-hairline-dark);
    padding-bottom:56px !important;
}
.hero-header h1.display-4{
    font-weight:600 !important;
    font-size:clamp(30px,4vw,44px) !important;
}
.breadcrumb-item a,
.breadcrumb-item.active{
    font-size:11.5px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    opacity:0.8;
}

/* ---------- Cards / panels ---------- */
.feature-detail-card,
.template-card,
.routing-card,
.collaboration-enquiry-card,
.service-item,
.team-item,
.faq-item,
.project-item{
    border-radius:3px !important;
    border:1px solid var(--se-hairline-light) !important;
    box-shadow:none !important;
    background:var(--se-paper-2) !important;
}
.feature-detail-card h3,
.template-card h3,
.template-card h4{
    font-weight:600;
}

/* ---------- Badges / pills / chips ---------- */
.badge,
.template-card span{
    font-family:'IBM Plex Mono', monospace !important;
    border-radius:2px !important;
    letter-spacing:0.02em;
}

/* ---------- Forms ---------- */
.form-control, .form-select{
    border-radius:2px !important;
    border-color:var(--se-hairline-light) !important;
    font-family:'IBM Plex Sans', sans-serif;
}
.form-control:focus, .form-select:focus{
    border-color:var(--se-trace) !important;
    box-shadow:0 0 0 1px var(--se-trace) !important;
}

/* ---------- Section titles (eyebrow-style) ---------- */
.section-title,
.btn.border.rounded-pill.text-primary{
    color:var(--se-rust) !important;
    font-family:'IBM Plex Mono', monospace;
    font-size:12px;
    letter-spacing:0.1em;
    text-transform:uppercase;
    border-color:var(--se-hairline-light) !important;
}

/* ---------- Footer ---------- */
.footer.bg-dark{
    background:var(--se-ink) !important;
    border-top:1px solid var(--se-hairline-dark);
}
.footer h5{
    font-family:'IBM Plex Mono', monospace !important;
    font-size:11.5px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:var(--se-text-muted-dark) !important;
    font-weight:500 !important;
}
.footer a,
.footer p{
    color:var(--se-text-muted-dark) !important;
}
.footer a:hover{ color:#FFFFFF !important; }
.footer .copyright{
    border-top:1px solid var(--se-hairline-dark) !important;
}

/* ---------- Chat / WhatsApp widget refinements ---------- */
.se-whatsapp-toggle{ background:#25D366 !important; }
.se-chat-toggle{ background:var(--se-amber) !important; color:var(--se-amber-ink) !important; }
.se-chat-header{ background:var(--se-ink) !important; }
.se-chat-form button[type="submit"]{
    background:var(--se-amber) !important;
    color:var(--se-amber-ink) !important;
    font-weight:600;
}

/* ---------- Spinner ---------- */
.spinner-grow.text-primary{ color:var(--se-amber) !important; }