:root{
    --bg-base:#14171B;
    --bg-panel:#1B1F25;
    --bg-panel-hover:#20252C;
    --hairline:#2A2F37;
    --hairline-soft:#22262D;
    --text-primary:#EDEFF2;
    --text-muted:#8A93A0;
    --text-faint:#5B6270;
    --brass:#D8A24A;
    --brass-dim:#8A6B34;
    --grid-line: rgba(216,162,74,0.055);

    --c-finance:#4FAE7A;
    --c-ai:#9B7FE0;
    --c-erp:#4C8FD9;
    --c-budget:#4FC1C6;
    --c-ads:#E0668C;
    --c-automation:#E0954F;
    --c-energy:#E0C94F;

    --display: 'Space Grotesk', sans-serif;
    --body: 'IBM Plex Sans', sans-serif;
    --mono: 'IBM Plex Mono', monospace;
  }

  *{ box-sizing:border-box; margin:0; padding:0; }
  html{ scroll-behavior:smooth; }
  body{
    background:var(--bg-base);
    color:var(--text-primary);
    font-family:var(--body);
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
    background-image:
      linear-gradient(var(--grid-line) 1px, transparent 1px),
      linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
    background-size:44px 44px;
  }

  a{ color:inherit; text-decoration:none; }
  img{ max-width:100%; display:block; }

  :focus-visible{
    outline:2px solid var(--brass);
    outline-offset:3px;
    border-radius:2px;
  }

  .wrap{
    max-width:1180px;
    margin:0 auto;
    padding:0 28px;
  }

  /* ---------- NAV ---------- */
  header{
    position:sticky;
    top:0;
    z-index:50;
    background:rgba(20,23,27,0.86);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--hairline-soft);
  }
  nav{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:18px 0;
  }
  .logo{
    display:flex;
    align-items:center;
    gap:10px;
    font-family:var(--display);
    font-weight:700;
    font-size:1.15rem;
    letter-spacing:0.02em;
  }
  .logo .dot{
    width:9px; height:9px; border-radius:50%;
    background:var(--brass);
    box-shadow:0 0 0 3px rgba(216,162,74,0.18);
  }
  .nav-links{
    display:flex;
    gap:28px;
    font-family:var(--mono);
    font-size:0.78rem;
    letter-spacing:0.04em;
    text-transform:uppercase;
    color:var(--text-muted);
  }
  .nav-links a{ transition:color .15s ease; }
  .nav-links a:hover{ color:var(--text-primary); }
  .nav-links a.brass{ color:var(--brass); }
  .nav-toggle{ display:none; }

  /* ---------- HERO ---------- */
  .hero{
    padding:120px 0 90px;
    text-align:center;
    position:relative;
  }
  .eyebrow{
    font-family:var(--mono);
    font-size:0.78rem;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--brass);
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-bottom:26px;
  }
  .eyebrow::before,.eyebrow::after{
    content:"";
    width:26px; height:1px;
    background:var(--brass-dim);
  }
  .hero h1{
    font-family:var(--display);
    font-weight:700;
    font-size:clamp(3rem, 9vw, 6.4rem);
    letter-spacing:-0.02em;
    line-height:0.98;
  }
  .hero .tagline{
    margin:26px auto 0;
    max-width:560px;
    color:var(--text-muted);
    font-size:1.08rem;
  }
  .hero .cta-row{
    margin-top:44px;
    display:flex;
    justify-content:center;
    gap:16px;
    flex-wrap:wrap;
  }
  .btn{
    font-family:var(--mono);
    font-size:0.82rem;
    letter-spacing:0.03em;
    padding:14px 26px;
    border-radius:3px;
    border:1px solid var(--hairline);
    transition:all .18s ease;
    display:inline-flex;
    align-items:center;
    gap:8px;
  }
  .btn-primary{
    background:var(--brass);
    color:#191307;
    border-color:var(--brass);
    font-weight:500;
  }
  .btn-primary:hover{ background:#e6b062; transform:translateY(-1px); }
  .btn-ghost{ color:var(--text-muted); }
  .btn-ghost:hover{ color:var(--text-primary); border-color:var(--text-faint); }

  /* ---------- PANEL / DASHBOARD STRIP ---------- */
  .readout{
    border-top:1px solid var(--hairline-soft);
    border-bottom:1px solid var(--hairline-soft);
    padding:16px 0;
    margin-top:70px;
  }
  .readout .wrap{
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:14px;
    font-family:var(--mono);
    font-size:0.74rem;
    color:var(--text-faint);
    letter-spacing:0.03em;
  }
  .readout span b{ color:var(--text-muted); font-weight:500; }

  /* ---------- SECTION HEADS ---------- */
  .section{ padding:100px 0; }
  .section-head{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:46px;
    flex-wrap:wrap;
  }
  .section-label{
    font-family:var(--mono);
    font-size:0.78rem;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--brass);
    margin-bottom:14px;
    display:block;
  }
  .section-head h2{
    font-family:var(--display);
    font-weight:600;
    font-size:clamp(1.8rem, 3.4vw, 2.6rem);
    letter-spacing:-0.01em;
  }
  .section-head p{
    color:var(--text-muted);
    max-width:380px;
    font-size:0.95rem;
  }

  /* ---------- MODULE GRID ---------- */
  .modules{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:1px;
    background:var(--hairline);
    border:1px solid var(--hairline);
  }
  .module{
    background:var(--bg-panel);
    padding:30px 26px 26px;
    display:flex;
    flex-direction:column;
    gap:16px;
    min-height:220px;
    position:relative;
    transition:background .18s ease;
  }
  .module:hover{ background:var(--bg-panel-hover); }
  .module:hover .module-arrow{ transform:translate(3px,-3px); opacity:1; }
  .module-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
  }
  .module-code{
    font-family:var(--mono);
    font-size:0.72rem;
    letter-spacing:0.08em;
    color:var(--text-faint);
  }
  .module-status{
    display:flex;
    align-items:center;
    gap:7px;
    font-family:var(--mono);
    font-size:0.65rem;
    color:var(--text-faint);
    text-transform:uppercase;
    letter-spacing:0.06em;
  }
  .module-dot{
    width:6px; height:6px; border-radius:50%;
    animation:pulse 2.6s ease-in-out infinite;
  }
  @keyframes pulse{
    0%,100%{ opacity:1; }
    50%{ opacity:0.35; }
  }
  .module h3{
    font-family:var(--display);
    font-weight:600;
    font-size:1.32rem;
    margin-top:auto;
  }
  .module p{
    color:var(--text-muted);
    font-size:0.88rem;
  }
  .module-arrow{
    font-family:var(--mono);
    font-size:0.8rem;
    color:var(--brass);
    opacity:0.55;
    transition:all .18s ease;
    margin-top:4px;
  }
  .module.wide{ grid-column:span 1; }

  @media (max-width:900px){
    .modules{ grid-template-columns:repeat(2,1fr); }
  }
  @media (max-width:560px){
    .modules{ grid-template-columns:1fr; }
  }

  /* ---------- ABOUT ---------- */
  .about{
    padding:100px 0;
    border-top:1px solid var(--hairline-soft);
    border-bottom:1px solid var(--hairline-soft);
  }
  .about .wrap{
    display:grid;
    grid-template-columns:0.9fr 1.4fr;
    gap:60px;
    align-items:start;
  }
  .about h2{
    font-family:var(--display);
    font-weight:600;
    font-size:clamp(1.7rem,3vw,2.3rem);
    line-height:1.15;
  }
  .about-copy p{
    font-size:1.05rem;
    color:var(--text-muted);
    max-width:620px;
  }
  .about-copy p + p{ margin-top:18px; }
  .about-copy strong{ color:var(--text-primary); font-weight:500; }
  @media (max-width:820px){
    .about .wrap{ grid-template-columns:1fr; gap:26px; }
  }

  /* ---------- PIPELINE ---------- */
  .pipeline-section{ padding:100px 0; }
  .pipeline{
    display:flex;
    align-items:center;
    gap:0;
    flex-wrap:wrap;
    font-family:var(--mono);
  }
  .pipe-step{
    background:var(--bg-panel);
    border:1px solid var(--hairline);
    padding:18px 22px;
    font-size:0.86rem;
    color:var(--text-primary);
    letter-spacing:0.02em;
    white-space:nowrap;
  }
  .pipe-arrow{
    color:var(--brass-dim);
    padding:0 14px;
    font-size:0.9rem;
  }
  @media (max-width:760px){
    .pipeline{ flex-direction:column; align-items:stretch; }
    .pipe-step{ text-align:center; }
    .pipe-arrow{ transform:rotate(90deg); padding:6px 0; align-self:center; }
  }

  /* ---------- FOOTER ---------- */
  footer{
    border-top:1px solid var(--hairline-soft);
    padding:64px 0 40px;
  }
  .footer-grid{
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr;
    gap:40px;
  }
  .footer-brand .logo{ margin-bottom:14px; }
  .footer-brand p{
    color:var(--text-muted);
    font-size:0.9rem;
    max-width:280px;
  }
  .footer-col h4{
    font-family:var(--mono);
    font-size:0.72rem;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--text-faint);
    margin-bottom:16px;
  }
  .footer-col a{
    display:block;
    color:var(--text-muted);
    font-size:0.9rem;
    padding:5px 0;
    transition:color .15s ease;
  }
  .footer-col a:hover{ color:var(--brass); }
  .footer-bottom{
    margin-top:56px;
    padding-top:24px;
    border-top:1px solid var(--hairline-soft);
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:12px;
    font-family:var(--mono);
    font-size:0.72rem;
    color:var(--text-faint);
    letter-spacing:0.03em;
  }
  @media (max-width:700px){
    .footer-grid{ grid-template-columns:1fr; gap:30px; }
  }

  @media (prefers-reduced-motion:reduce){
    *{ animation-duration:0.001ms !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
  }

  @media (max-width:640px){
    .nav-links{ display:none; }
    .hero{ padding:90px 0 60px; }
  }

  /* ---------- INNER PAGES (About / Privacy / Terms) ---------- */
  .page-hero{
    padding:80px 0 50px;
    border-bottom:1px solid var(--hairline-soft);
  }
  .page-hero .section-label{ margin-bottom:18px; }
  .page-hero h1{
    font-family:var(--display);
    font-weight:600;
    font-size:clamp(2.2rem, 5vw, 3.4rem);
    letter-spacing:-0.01em;
    max-width:680px;
  }
  .page-hero .updated{
    margin-top:18px;
    font-family:var(--mono);
    font-size:0.78rem;
    color:var(--text-faint);
    letter-spacing:0.04em;
  }

  .prose{
    padding:70px 0 100px;
    max-width:760px;
    margin:0 auto;
  }
  .prose h2{
    font-family:var(--display);
    font-weight:600;
    font-size:1.4rem;
    margin-top:48px;
    margin-bottom:16px;
    letter-spacing:-0.005em;
  }
  .prose h2:first-child{ margin-top:0; }
  .prose p{
    color:var(--text-muted);
    font-size:1rem;
    line-height:1.7;
  }
  .prose p + p{ margin-top:16px; }
  .prose ul{
    margin:16px 0 0 0;
    padding-left:0;
    list-style:none;
  }
  .prose ul li{
    color:var(--text-muted);
    font-size:1rem;
    line-height:1.7;
    padding-left:22px;
    position:relative;
    margin-top:10px;
  }
  .prose ul li::before{
    content:"—";
    position:absolute;
    left:0;
    color:var(--brass-dim);
  }
  .prose strong{ color:var(--text-primary); font-weight:500; }
  .prose a{ color:var(--brass); border-bottom:1px solid var(--brass-dim); }
  .prose a:hover{ color:#e6b062; }

  .module-index{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:1px;
    background:var(--hairline);
    border:1px solid var(--hairline);
    margin-top:50px;
  }
  .module-index a{
    background:var(--bg-panel);
    padding:16px 18px;
    font-family:var(--mono);
    font-size:0.8rem;
    color:var(--text-muted);
    display:flex;
    align-items:center;
    justify-content:space-between;
    transition:background .15s ease, color .15s ease;
  }
  .module-index a:hover{ background:var(--bg-panel-hover); color:var(--text-primary); }
  @media (max-width:900px){ .module-index{ grid-template-columns:repeat(2,1fr); } }
  @media (max-width:560px){ .module-index{ grid-template-columns:1fr; } }