/* GRITS UI design system v1. Real, responsive components; no raster controls.
   Scope: anything inside .gx. Legacy page decoration is overridden here. */
:root{
  --gx-bg:#141211;--gx-surface:#1d1b1a;--gx-surface-2:#262321;--gx-line:rgba(255,122,26,.42);--gx-line-soft:rgba(244,236,222,.14);
  --gx-text:#f4ecde;--gx-muted:#c9bfae;--gx-primary:#ff7a1a;--gx-primary-ink:#160b02;--gx-primary-hi:#ff9440;
  --gx-red:#e2403a;--gx-ok:#43c47a;--gx-warn:#f5b13d;--gx-cyan:#00e5ff;
  --gx-r:12px;--gx-r-sm:8px;--gx-shadow:0 18px 40px -18px rgba(0,0,0,.8);
  --gx-display:"Archivo Black","Archivo",system-ui,sans-serif;--gx-body:"Archivo",system-ui,sans-serif;--gx-mono:"Roboto Mono",ui-monospace,monospace;
}
.gx,.gx *{box-sizing:border-box}
.gx{color:var(--gx-text)!important;font-family:var(--gx-body)!important}
.gx :is(h1,h2,h3,p){margin:0;color:inherit!important;text-shadow:none!important;background:none!important}
.gx a{text-decoration:none}
.gx-wrap{width:min(1200px,100% - 40px);margin-inline:auto}

/* Eyebrow + heading */
.gx .gx-eyebrow{display:inline-flex;align-items:center;gap:8px;font:700 12px/1 var(--gx-mono)!important;letter-spacing:.16em;text-transform:uppercase;color:var(--gx-primary)!important;border-left:3px solid var(--gx-red);padding-left:9px}
.gx .gx-h1{font:400 clamp(40px,7vw,84px)/.95 var(--gx-display)!important;text-transform:uppercase;letter-spacing:-.01em;color:var(--gx-text)!important;margin:14px 0 14px!important}
.gx .gx-h1 em{font-style:normal;color:var(--gx-primary)!important}
.gx .gx-lead{font:500 clamp(16px,1.6vw,19px)/1.5 var(--gx-body)!important;color:var(--gx-muted)!important;max-width:56ch}

/* Buttons */
.gx .gx-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:var(--gx-r-sm);font:700 14px/1 var(--gx-body);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;white-space:nowrap;transition:background .15s,transform .1s,box-shadow .15s,border-color .15s;border:1px solid transparent}
.gx .gx-btn:active{transform:translateY(1px)}
.gx .gx-btn:focus-visible{outline:2px solid var(--gx-cyan);outline-offset:2px}
.gx .gx-btn--primary{background:var(--gx-primary);color:var(--gx-primary-ink);box-shadow:0 8px 24px -10px rgba(255,122,26,.7)}
.gx .gx-btn--primary:hover{background:var(--gx-primary-hi)}
.gx .gx-btn--secondary{background:rgba(18,25,33,.85);color:var(--gx-text);border-color:var(--gx-line)}
.gx .gx-btn--secondary:hover{border-color:var(--gx-primary);color:var(--gx-primary)}
.gx .gx-btn--tertiary{color:var(--gx-primary);padding:0 4px;min-height:36px}
.gx .gx-btn--tertiary:hover{color:var(--gx-primary-hi);text-decoration:underline;text-underline-offset:4px}
.gx .gx-btn svg{width:16px;height:16px;flex:none}

/* Cards / panels */
.gx .gx-card{background:linear-gradient(180deg,rgba(24,33,43,.92),rgba(14,20,27,.92));border:1px solid var(--gx-line);border-radius:var(--gx-r);padding:20px;box-shadow:var(--gx-shadow);backdrop-filter:blur(8px)}
.gx a.gx-card{display:flex;gap:14px;color:var(--gx-text);transition:border-color .15s,transform .15s}
.gx a.gx-card:hover{border-color:var(--gx-primary);transform:translateY(-2px)}
.gx .gx-card h3{font:700 16px/1.2 var(--gx-body)!important;text-transform:uppercase;letter-spacing:.03em;color:var(--gx-primary)!important;margin-bottom:6px!important}
.gx .gx-card p{font:400 14px/1.5 var(--gx-body)!important;color:var(--gx-muted)!important}
.gx .gx-ico{flex:none;width:40px;height:40px;color:var(--gx-primary)}

/* Form fields */
.gx .gx-field{position:relative;display:flex;align-items:center;flex:1;min-width:0}
.gx .gx-field svg{position:absolute;left:14px;width:18px;height:18px;color:var(--gx-muted);pointer-events:none}
.gx .gx-input{all:unset;box-sizing:border-box;width:100%;min-height:48px;padding:0 16px 0 42px;border-radius:var(--gx-r-sm);background:rgba(8,12,16,.85);border:1px solid var(--gx-line-soft);color:var(--gx-text);font:500 16px/1 var(--gx-body)}
.gx .gx-input::placeholder{color:#9a917f}
.gx .gx-input:focus{border-color:var(--gx-primary);box-shadow:0 0 0 3px rgba(255,122,26,.25)}

/* Badges */
.gx .gx-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;font:700 11px/1 var(--gx-mono);letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--gx-red);color:var(--gx-text);background:rgba(226,64,58,.12)}
.gx .gx-badge--ok{border-color:var(--gx-ok);background:rgba(67,196,122,.14)}
.gx .gx-badge--fee{border-color:var(--gx-primary);background:rgba(255,122,26,.12);color:var(--gx-primary)}

/* Tabs / filter pills (keep aria-pressed contract) */
.gx .gx-tabs{display:flex;flex-wrap:wrap;gap:8px}
.gx .gx-tab{all:unset;box-sizing:border-box;cursor:pointer;min-height:38px;padding:0 16px;border-radius:999px;display:inline-flex;align-items:center;font:600 13px/1 var(--gx-body);color:var(--gx-text);background:rgba(18,25,33,.85);border:1px solid var(--gx-line-soft);opacity:1!important;filter:none!important}
.gx .gx-tab:hover{border-color:var(--gx-primary)}
.gx .gx-tab[aria-pressed=true],.gx .gx-tab[aria-selected=true]{background:var(--gx-primary);border-color:var(--gx-primary);color:var(--gx-primary-ink)}
.gx .gx-tab:focus-visible{outline:2px solid var(--gx-cyan);outline-offset:2px}

/* Alerts, empty, loading */
.gx .gx-alert{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:var(--gx-r);border:1px solid var(--gx-line);background:rgba(255,122,26,.08)}
.gx .gx-empty{text-align:center;padding:40px 20px;color:var(--gx-muted);border:1px dashed var(--gx-line-soft);border-radius:var(--gx-r)}
.gx .gx-skel{background:linear-gradient(90deg,#141b23 0,#1d2731 50%,#141b23 100%);background-size:200% 100%;animation:gx-sh 1.4s infinite;border-radius:var(--gx-r-sm)}
@keyframes gx-sh{to{background-position:-200% 0}}

/* Heroes */
.gx-hero{position:relative;isolation:isolate;overflow:hidden;background:var(--gx-bg);border-bottom:1px solid var(--gx-line)}
.gx-hero__bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:right center}
.gx-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(11,15,20,.97) 0%,rgba(11,15,20,.88) 38%,rgba(11,15,20,.35) 75%,rgba(11,15,20,.15) 100%),linear-gradient(0deg,rgba(11,15,20,.95) 0%,transparent 40%)}
.gx-hero__in{padding:clamp(40px,7vw,96px) 0 clamp(32px,5vw,64px)}
.gx-hero__copy{max-width:640px}
.gx-hero__row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:22px}
.gx-hero__search{display:flex;gap:10px;margin-top:24px;max-width:620px}
.gx-hero__stats{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.gx-split{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px}
.gx-split .gx-card{display:flex;flex-direction:column;gap:10px}
.gx-split .gx-card .gx-hero__row{margin-top:auto;padding-top:6px}
.gx-crumb{display:flex;gap:8px;font:500 13px/1 var(--gx-body);color:var(--gx-muted);margin-bottom:18px}
.gx-crumb a{color:var(--gx-text)!important}

/* Help */
.gx-ask{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;margin-top:26px;max-width:900px}
.gx-ask__form{display:flex;gap:10px;grid-column:1/-1}
.gx-ask__try{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px 14px;font:500 13px/1.4 var(--gx-body);color:var(--gx-muted)}
.gx-ask__try button{all:unset;cursor:pointer;color:var(--gx-text);border-bottom:1px dotted var(--gx-line)}
.gx-ask__try button:hover,.gx-ask__try button:focus-visible{color:var(--gx-primary)}
.gx .gx-ai{color:var(--gx-cyan)!important}
.gx-topics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:30px 0 10px}
.gx-hero__char{position:absolute;right:max(20px,calc((100% - 1200px)/2));bottom:0;width:min(240px,22vw);height:auto;z-index:0;pointer-events:none}

/* Mobile bottom navigation */
.gx-bnav{display:none}
@media (max-width:760px){
  .gx-split,.gx-topics{grid-template-columns:1fr}
  .gx-hero__search,.gx-ask__form{flex-direction:column}
  .gx-hero__search .gx-btn,.gx-ask__form .gx-btn{width:100%}
  .gx-hero::before{background:linear-gradient(0deg,rgba(11,15,20,.98) 20%,rgba(11,15,20,.7) 70%,rgba(11,15,20,.5) 100%)}
  .gx-hero__char{display:none}
  .gx-bnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:900;background:rgba(11,15,20,.96);border-top:1px solid var(--gx-line);padding:6px 4px calc(6px + env(safe-area-inset-bottom));backdrop-filter:blur(10px)}
  .gx-bnav a{display:flex;flex-direction:column;align-items:center;gap:3px;min-height:48px;justify-content:center;font:600 11px/1 var(--gx-body);color:var(--gx-muted)!important;background:none!important;border:0!important}
  .gx-bnav a svg{width:22px;height:22px}
  .gx-bnav a[aria-current=page]{color:var(--gx-primary)!important}
  body.gx-has-bnav{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  body.gx-has-bnav #gs-btn{bottom:calc(80px + env(safe-area-inset-bottom))!important}
}
@media (prefers-reduced-motion:reduce){.gx *{transition:none!important;animation:none!important}}
/* Win over legacy pill/input rules */
.gx .filters .gx-tab,.gx .gx-tabs .gx-tab{background:rgba(18,25,33,.85)!important;border:1px solid var(--gx-line-soft)!important;padding:0 16px!important;line-height:1!important;color:var(--gx-text)!important;font:600 13px/1 var(--gx-body)!important;letter-spacing:.02em!important;text-transform:none!important;transform:none!important}
.gx .filters .gx-tab[aria-pressed=true],.gx .gx-tabs .gx-tab[aria-pressed=true]{background:var(--gx-primary)!important;border-color:var(--gx-primary)!important;color:var(--gx-primary-ink)!important}
.gx .gx-input,.gx .gx-input::placeholder{text-transform:none!important;letter-spacing:0!important;font-family:var(--gx-body)!important}
.gx .gx-btn{font-family:var(--gx-body)!important}
.gx .gx-tab{min-height:38px!important;height:auto!important}
.gx button.gx-btn--primary,.gx a.gx-btn--primary{background:var(--gx-primary)!important;color:var(--gx-primary-ink)!important;border:1px solid var(--gx-primary)!important;box-shadow:0 8px 24px -10px rgba(255,122,26,.7)!important;font:700 14px/1 var(--gx-body)!important;letter-spacing:.04em!important;padding:0 20px!important;min-height:48px!important;text-shadow:none!important}
.gx .gx-ask__try button{all:unset!important;cursor:pointer!important;color:var(--gx-text)!important;border-bottom:1px dotted var(--gx-primary)!important;font:500 13px/1.6 var(--gx-body)!important}
.gx .gx-ask__try button:hover,.gx .gx-ask__try button:focus-visible{color:var(--gx-primary)!important}
.gx .gx-input{background:rgba(8,12,16,.85)!important;border:1px solid var(--gx-line-soft)!important;color:var(--gx-text)!important;box-shadow:none!important}
.gx .gx-input:focus{border-color:var(--gx-primary)!important;box-shadow:0 0 0 3px rgba(255,122,26,.25)!important}
html body #gx-ask button.gx-btn--primary{background:var(--gx-primary)!important;background-image:none!important;color:var(--gx-primary-ink)!important;border:1px solid var(--gx-primary)!important}