/* SAWIX product identity — matches assets/css/brand.css. */
:root {
  --brand:#008766; --ink:#142922; --paper:#f7f9f6;
  --bg:#f7f9f6; --surface:#fff; --surface2:#e8f0e9;
  --bg-primary:#f7f9f6; --bg-secondary:#e8f0e9; --bg-card:#fff; --bg-card-hover:#edf4ee;
  --bg-base:#f7f9f6; --bg-surface:#e8f0e9; --bg-raised:#edf4ee; --bg-hover:#e2eee5;
  --navy-deep:#f7f9f6; --navy-dark:#e8f0e9; --navy-mid:#edf4ee;
  --bg-color:#f7f9f6; --text-color:#142922; --primary-color:#008766; --secondary-color:#006c52; --cta-color:#008766;
  --text:#142922; --text-primary:#142922; --text-light:#142922;
  --text-secondary:#53665d; --text-muted:#53665d; --text-gray:#53665d;
  --accent:#008766; --accent2:#006c52; --accent-light:#006c52; --text-accent:#006c52;
  --gold:#008766; --gold-light:#006c52; --gold-bright:#006c52; --gold-dark:#006c52;
  --blue:#008766; --blue-light:#006c52; --green:#007453; --red:#b83535;
  --gave:#007453; --got:#95600c; --danger:#b83535; --success:#007453; --info:#246149;
  --border:#d8e3db; --border-bright:#b9d7c8; --border-gold:#b9d7c8;
  --accent-dim:#e8f3ed; --accent-glow:transparent; --gold-glow:transparent;
  --radius:8px; --radius-lg:12px; --radius-xl:16px; --radius-md:8px;
  --shadow:0 6px 24px rgba(20,41,34,.06); --shadow-card:0 6px 24px rgba(20,41,34,.06);
  --shadow-lg:0 16px 48px rgba(20,41,34,.12); --shadow-gold:none;
}
body, body.landing-body { background:var(--paper); color:var(--ink); font-family:'Plus Jakarta Sans',sans-serif; }
h1,h2,h3,h4,h5,h6,.brand-serif { font-family:'Plus Jakarta Sans',sans-serif; letter-spacing:-.04em; text-wrap:balance; }
p { text-wrap:pretty; }
input,select,textarea,button { font-family:inherit; }
input,select,textarea { accent-color:var(--brand); }
a { color:var(--brand); }
.product-brand { display:inline-flex; align-items:center; gap:12px; flex-shrink:0; text-decoration:none!important; }
.product-brand img { width:132px; height:auto; display:block; }
.product-brand span { border-left:1px solid #b9d7c8; padding-left:12px; font-size:12px; font-weight:600; color:#53665d; letter-spacing:.02em; }
.sidebar .product-brand { padding:8px 0; }
.sidebar,.topbar,.landing-nav,.minimal-nav,.navbar-scrape { background:#f7f9f6; border-color:#d8e3db; }
.btn-gold,.btn-primary,.cta-btn,.neon-btn { background:#008766; color:#fff; box-shadow:none; border-radius:6px; }
.btn-gold:hover,.btn-primary:hover,.cta-btn:hover,.neon-btn:hover { background:#006c52; color:#fff; box-shadow:none; }
.btn-outline,.btn-ghost { color:#006c52; border-color:#b9d7c8; }
.glass { background:#fff; border:1px solid #d8e3db; box-shadow:none; backdrop-filter:none; }
.gradient-text { background:none; color:#008766; -webkit-text-fill-color:#008766; }
.nav-link.active,.sb-item.active { background:#e8f3ed; color:#006c52; }
.stat-value,.stat-num,td { font-variant-numeric:tabular-nums; }
:is(a,button,input,select,textarea):focus-visible { outline:3px solid #008766; outline-offset:4px; }
.product-footer { border-top:1px solid #d8e3db; padding:24px max(20px,5vw); color:#53665d; font-size:12px; display:flex; gap:24px; flex-wrap:wrap; }
.product-footer a { color:#006c52; }
@media(max-width:600px) { .product-brand img { width:106px; } .product-brand { gap:8px; } .product-brand span { padding-left:8px; } .navbar-scrape { align-items:flex-start; gap:20px; flex-direction:column; padding:18px 20px; } .navbar-scrape>div { display:flex; flex-wrap:wrap; gap:8px; } .navbar-scrape .btn-ghost { padding:8px 10px; margin:0!important; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }

.minimal-nav { mix-blend-mode:normal; padding:20px 5vw; border-bottom:1px solid #d8e3db; }
.auth-card>.product-brand { margin-bottom:24px; }
.auth-logo .product-brand { margin-bottom:18px; }
.main-content,.page-body,.grid-2>*,.grid-3>*,.stat-card { min-width:0; }
.stat-card-value { font-size:clamp(1.3rem,2.4vw,1.9rem); overflow-wrap:anywhere; }
.modal { width:min(100%,560px); max-height:calc(100dvh - 40px); }
.modal-overlay { padding:20px; }
.auth-wrap { min-height:100dvh; }
.auth-wrap { grid-template-columns:minmax(0,1fr); }
.auth-card,.currency-tile { min-width:0; }
.main-content { flex:1 1 0; }
.stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.stat-card-value { min-width:0; }
.flash-error,.flash-danger { color:#b83535; }
.flash-warning { color:#95600c; }
.flash-info { color:#246149; }
.badge-pending { background:#e8f3ed; color:#246149; }
.badge-partial { background:#f6efdf; color:#95600c; }
.badge-overdue,.btn-danger { color:#b83535; }
.budget-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-bottom:16px; }
.budget-summary>div { min-width:0; }
.budget-summary .font-data { overflow-wrap:anywhere; }
.status-badge { font-variant-numeric:tabular-nums; }
@media(max-width:600px) {
  .page-header { flex-wrap:wrap; gap:16px; }
  .topbar-title { font-size:1rem; min-width:0; }
  .topbar-actions { gap:8px; flex-wrap:wrap; }
  .topbar { padding:12px 16px; gap:12px; flex-wrap:wrap; }
  .topbar-actions { margin-left:auto; max-width:100%; }
  .auth-card { padding:24px 20px; }
  .budget-summary { grid-template-columns:1fr; gap:20px; }
  .modal-overlay { padding:12px; }
  .modal { max-height:calc(100dvh - 24px); }
  .table-wrap { max-width:100%; }
}
.minimal-nav .nav-link { color:#006c52; }
#webgl-canvas { display:none; }
.hero-section { min-height:auto; padding:180px 8vw 100px; align-items:flex-start; text-align:left; max-width:1280px; margin:auto; }
.hero-title { font-size:clamp(3.4rem,6.5vw,6.4rem); font-weight:800; letter-spacing:-.065em; line-height:1.06; }
.hero-subtitle { color:#53665d; font-size:18px; line-height:1.8; max-width:530px; }
.cta-btn { padding:16px 26px; font-size:15px; }
.story-chapter { min-height:auto; padding:70px 8vw; opacity:1; transform:none; align-items:flex-start; text-align:left; border-top:1px solid #d8e3db; }
.chapter-title { font-size:clamp(2.4rem,4vw,4rem); font-weight:700; }
.chapter-num { font-family:inherit; font-size:12px; color:#008766; }
.chapter-desc { font-size:17px; color:#53665d; max-width:620px; }
@media(max-width:600px) { .hero-section { padding:140px 20px 70px; } .story-chapter { padding:50px 20px; } }