/*
Theme Name: ERPWhizz
Theme URI: https://erpwhizz.com/
Author: Zove Systems
Author URI: https://zovesolutions.com/
Description: Single-page WordPress theme for ERPWhizz, based on the supplied ERPWhizz landing page.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: erpwhizz
*/

:root{
    --ink:#16233A;
    --paper:#F6F4EF;
    --paper-dim:#EDEAE0;
    --brass:#B9812F;
    --brass-dark:#8F631F;
    --steel:#3D5A73;
    --slate:#4A5568;
    --line:#D9D5C9;
    --line-dark:#3A4A63;

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

    --bs-body-font-family: var(--body);
    --bs-body-color: var(--slate);
    --bs-body-bg: var(--paper);
  }

  html{ scroll-behavior:smooth; }
  body{ background:var(--paper); color:var(--slate); }
  h1,h2,h3,h4,h5{ font-family:var(--display); color:var(--ink); letter-spacing:-0.015em; }
  a{ text-decoration:none; }
  :focus-visible{ outline:2px solid var(--brass); outline-offset:3px; }
  @media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }

  .eyebrow{
    font-family:var(--mono); font-size:.75rem; letter-spacing:.14em; text-transform:uppercase;
    color:var(--brass-dark); display:inline-flex; align-items:center; gap:10px;
  }
  .eyebrow::before{ content:""; width:22px; height:1px; background:var(--brass-dark); display:inline-block; }

  /* ---------- Navbar ---------- */
  .navbar-erp{ background:rgba(246,244,239,.94); backdrop-filter:blur(6px); border-bottom:1px solid var(--line); }
  .navbar-erp .navbar-brand{ font-family:var(--display); font-weight:700; font-size:1.15rem; color:var(--ink); display:flex; align-items:center; gap:9px; }
  .navbar-erp .brand-mark{ width:11px; height:11px; background:var(--brass); display:inline-block; transform:rotate(45deg); }
  .navbar-erp .nav-link{ font-family:var(--mono); font-size:.82rem; color:var(--slate); }
  .navbar-erp .nav-link:hover{ color:var(--ink); }
  .btn-brass{ background:var(--brass); border-color:var(--brass); color:var(--ink); font-family:var(--mono); font-size:.85rem; font-weight:600; }
  .btn-brass:hover{ background:#CE9642; border-color:#CE9642; color:var(--ink); }
  .btn-outline-ink{ border:1px solid var(--ink); color:var(--ink); font-family:var(--mono); font-size:.85rem; font-weight:600; }
  .btn-outline-ink:hover{ background:var(--ink); color:var(--paper); }
  .btn-outline-paper{ border:1px solid rgba(246,244,239,.5); color:var(--paper); font-family:var(--mono); font-size:.85rem; font-weight:600; }
  .btn-outline-paper:hover{ background:var(--paper); color:var(--ink); border-color:var(--paper); }

  /* ---------- Hero ---------- */
  .hero{ position:relative; background:var(--ink); color:var(--paper); overflow:hidden; padding:6rem 0 4rem; }
  .hero-grid{
    position:absolute; inset:0;
    background-image:linear-gradient(var(--line-dark) 1px, transparent 1px), linear-gradient(90deg, var(--line-dark) 1px, transparent 1px);
    background-size:56px 56px; opacity:.3;
    mask-image:linear-gradient(to bottom, black, transparent 88%);
  }
  .hero .container{ position:relative; z-index:2; }
  .hero h1{ color:var(--paper); font-weight:600; font-size:clamp(2.2rem, 4.6vw, 3.4rem); line-height:1.06; max-width:15ch; }
  .hero h1 em{ font-style:normal; color:var(--brass); }
  .hero p.lead{ color:#C7CEDA; font-size:1.05rem; max-width:46ch; }
  .hero-eyebrow{ color:var(--brass); }
  .hero-eyebrow::before{ background:var(--brass); }

  .demo-card{
    background:rgba(246,244,239,.06); border:1px solid rgba(246,244,239,.18);
    padding:1.25rem 1.4rem; margin-top:1.75rem; max-width:420px;
  }
  .demo-card .demo-label{ font-family:var(--mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; color:var(--brass); }
  .demo-card .demo-cred{ font-family:var(--mono); font-size:.92rem; color:var(--paper); }
  .demo-card .demo-cred span{ color:#8F98A8; }

  /* ---------- Stats ---------- */
  .stats-bar{ background:var(--paper-dim); border-bottom:1px solid var(--line); }
  .stats-bar .stat-col{ border-right:1px solid var(--line); padding:1.75rem 1rem; text-align:center; }
  .stats-bar .stat-col:last-child{ border-right:none; }
  .stat-num{ font-family:var(--display); font-size:1.9rem; font-weight:700; color:var(--ink); }
  .stat-label{ font-family:var(--mono); font-size:.72rem; text-transform:uppercase; letter-spacing:.05em; color:var(--brass-dark); margin-top:.25rem; }

  /* ---------- Sections ---------- */
  section{ padding:5.5rem 0; }
  .section-head{ max-width:640px; margin-bottom:3rem; }
  .section-head p{ font-size:1rem; margin-top:.9rem; }

  /* ---------- Feature cards ---------- */
  .feature-card{ background:#fff; border:1px solid var(--line); padding:2rem 1.75rem; height:100%; transition:transform .15s, border-color .15s; }
  .feature-card:hover{ transform:translateY(-3px); border-color:var(--brass); }
  .feature-icon{
    width:46px; height:46px; display:flex; align-items:center; justify-content:center;
    background:var(--paper-dim); color:var(--brass-dark); font-size:1.3rem; margin-bottom:1.1rem;
  }
  .feature-card h3{ font-size:1.15rem; font-weight:600; margin-bottom:.6rem; }
  .feature-card p{ font-size:.9rem; margin-bottom:0; }

  /* ---------- Why band ---------- */
  .why-band{ background:var(--ink); color:var(--paper); }
  .why-band .eyebrow{ color:var(--brass); }
  .why-band .eyebrow::before{ background:var(--brass); }
  .why-band h2{ color:var(--paper); }
  .why-item{ display:flex; gap:1rem; }
  .why-num{ font-family:var(--mono); color:var(--brass); font-size:.85rem; padding-top:.15rem; }
  .why-item h4{ color:var(--paper); font-size:1.05rem; margin-bottom:.4rem; }
  .why-item p{ color:#C7CEDA; font-size:.9rem; margin-bottom:0; }

  /* ---------- Pricing ---------- */
  .pricing-card{
    background:#fff; border:1px solid var(--line); padding:2rem 1.6rem; height:100%;
    display:flex; flex-direction:column; position:relative;
  }
  .pricing-card.popular{ border-color:var(--brass); box-shadow:0 10px 30px rgba(185,129,47,.14); }
  .popular-tag{
    position:absolute; top:-1px; right:-1px; background:var(--brass); color:var(--ink);
    font-family:var(--mono); font-size:.68rem; letter-spacing:.05em; text-transform:uppercase;
    padding:.3rem .65rem;
  }
  .plan-tag{ font-family:var(--mono); font-size:.7rem; letter-spacing:.06em; text-transform:uppercase; color:var(--brass-dark); }
  .plan-name{ font-size:1.25rem; font-weight:600; margin:.5rem 0 .75rem; }
  .plan-scope{ font-size:.85rem; color:var(--slate); margin-bottom:1.25rem; min-height:2.6em; }
  .price-row{ display:flex; align-items:baseline; gap:.35rem; margin-bottom:1.5rem; padding-bottom:1.5rem; border-bottom:1px dashed var(--line); }
  .price-currency{ font-family:var(--mono); font-size:1.1rem; color:var(--ink); }
  .price-placeholder{
    font-family:var(--display); font-size:2rem; font-weight:700; color:var(--ink);
    border-bottom:2px dashed var(--brass); line-height:1;
  }
  .price-period{ font-family:var(--mono); font-size:.78rem; color:var(--slate); }
  .plan-features{ list-style:none; padding:0; margin:0 0 1.5rem; flex-grow:1; }
  .plan-features li{ font-size:.85rem; padding:.4rem 0; display:flex; gap:.55rem; }
  .plan-features li i{ color:var(--brass-dark); margin-top:.15rem; }
  .plan-cta{ font-family:var(--mono); font-size:.82rem; font-weight:600; padding:.65rem 1rem; text-align:center; }

  .pricing-note{
    font-family:var(--mono); font-size:.78rem; color:var(--slate); text-align:center;
    border:1px dashed var(--line); background:var(--paper-dim); padding:.9rem 1.2rem; margin-top:2.5rem;
  }

  /* ---------- CTA band ---------- */
  .cta-band{ background:var(--paper-dim); border-top:1px solid var(--line); border-bottom:1px solid var(--line); text-align:center; }
  .cta-band h2{ margin-bottom:.75rem; }
  .cta-band p{ max-width:52ch; margin:0 auto 1.75rem; }

  /* ---------- Footer ---------- */
  footer{ background:var(--ink); color:#8F98A8; padding:2.25rem 0; }
  footer a{ color:#8F98A8; }
  footer a:hover{ color:var(--brass); }
  .footer-inner{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; font-family:var(--mono); font-size:.78rem; }