/* ============================================================
   Software Equality — Research Stats & Data Visualisation CSS
   research-stats.css  (light-theme rewrite)
   ============================================================ */

/* Data section wrapper */
.rs-section { background: var(--surface,#F5E8D8); border-radius: 20px; padding: 3rem 2rem; margin: 2rem 0; border: 1px solid rgba(0,0,0,0.08); position: relative; overflow: hidden; }
.rs-section::before { content:''; position:absolute; inset:0; background: radial-gradient(ellipse 70% 50% at 20% 30%, rgba(255,159,0,0.06) 0%, transparent 60%); pointer-events:none; }
.rs-section > * { position: relative; z-index:1; }
.rs-title { font-size: clamp(1.3rem,3vw,1.9rem); font-weight:800; margin-bottom:0.4rem; background: linear-gradient(90deg,#C47A00,#0099BB); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; padding-left:1px; display:block; }
.rs-sub   { color: rgba(0,0,0,0.55); font-size:0.9rem; margin-bottom:2rem; }
.rs-source { font-size:0.72rem; color:rgba(0,0,0,0.4); margin-top:0.5rem; font-style:italic; }

/* Stat cards grid */
.rs-stats { display:grid; grid-template-columns: repeat(auto-fit,minmax(160px,1fr)); gap:1rem; margin-bottom:2rem; }
.rs-stat  { background:rgba(255,255,255,0.7); border:1px solid rgba(0,0,0,0.08); border-radius:14px; padding:1.2rem 1rem; text-align:center; transition: transform .2s, box-shadow .2s; }
.rs-stat:hover { transform:translateY(-3px); box-shadow:0 12px 32px rgba(0,0,0,0.10); }
.rs-stat-num  { font-size: clamp(1.6rem,4vw,2.2rem); font-weight:800; letter-spacing:-0.04em; line-height:1; background: linear-gradient(135deg,#C47A00,#E8A000); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.rs-stat-num.cyan { background: linear-gradient(135deg,#0099BB,#6B2FAE); -webkit-background-clip:text; background-clip:text; }
.rs-stat-num.green { background: linear-gradient(135deg,#007A5A,#0099BB); -webkit-background-clip:text; background-clip:text; }
.rs-stat-label { font-size:0.78rem; color:rgba(0,0,0,0.6); margin-top:0.35rem; line-height:1.3; }
.rs-stat-source { font-size:0.65rem; color:rgba(0,0,0,0.38); margin-top:0.25rem; }

/* Bar chart */
.rs-chart { margin: 1.5rem 0; }
.rs-chart-title { font-size:0.82rem; font-weight:600; color:rgba(0,0,0,0.65); margin-bottom:1rem; text-transform:uppercase; letter-spacing:.06em; }
.rs-bar-row { display:flex; align-items:center; gap:0.75rem; margin-bottom:0.65rem; }
.rs-bar-label { font-size:0.8rem; color:rgba(0,0,0,0.65); width:130px; flex-shrink:0; text-align:right; }
.rs-bar-track { flex:1; background:rgba(0,0,0,0.06); border-radius:4px; height:22px; overflow:hidden; position:relative; }
.rs-bar-fill  { height:100%; border-radius:4px; display:flex; align-items:center; padding-left:0.5rem; font-size:0.72rem; font-weight:700; color:rgba(0,0,0,0.8); transition: width 1.2s cubic-bezier(0.16,1,0.3,1); width:0; }
.rs-bar-fill.gold   { background: linear-gradient(90deg,#FF9F00,#FFBF40); }
.rs-bar-fill.cyan   { background: linear-gradient(90deg,#00D4FF,#7B2FBE); }
.rs-bar-fill.green  { background: linear-gradient(90deg,#00C896,#00D4FF); }
.rs-bar-fill.purple { background: linear-gradient(90deg,#7B2FBE,#A855F7); }
.rs-bar-fill.red    { background: linear-gradient(90deg,#ef4444,#f87171); }
@media(max-width:600px){ .rs-bar-label { width:90px; font-size:0.72rem; } }

/* Timeline */
.rs-timeline { position:relative; padding-left:1.5rem; margin:1.5rem 0; }
.rs-timeline::before { content:''; position:absolute; left:0.5rem; top:0; bottom:0; width:2px; background:linear-gradient(180deg,#FF9F00,#00D4FF,#7B2FBE); border-radius:2px; }
.rs-tl-item { position:relative; margin-bottom:1.25rem; padding-left:1rem; }
.rs-tl-item::before { content:''; position:absolute; left:-1.1rem; top:0.35rem; width:10px; height:10px; border-radius:50%; background:#FF9F00; border:2px solid var(--surface,#F5E8D8); box-shadow:0 0 8px rgba(255,159,0,0.4); }
.rs-tl-date  { font-size:0.72rem; font-weight:700; color:#B06A00; text-transform:uppercase; letter-spacing:.05em; }
.rs-tl-text  { font-size:0.88rem; color:rgba(0,0,0,0.70); margin-top:0.15rem; line-height:1.4; }

/* Ranking list */
.rs-rank { margin:1.5rem 0; }
.rs-rank-item { display:flex; align-items:flex-start; gap:0.85rem; padding:0.85rem 0; border-bottom:1px solid rgba(0,0,0,0.07); }
.rs-rank-item:last-child { border-bottom:none; }
.rs-rank-num  { width:32px; height:32px; border-radius:50%; background:linear-gradient(135deg,#FF9F00,#FFBF40); display:flex; align-items:center; justify-content:center; font-size:0.75rem; font-weight:800; color:#000; flex-shrink:0; }
.rs-rank-body { flex:1; min-width:0; }
.rs-rank-name { font-size:0.9rem; font-weight:600; color:rgba(0,0,0,0.85); }
.rs-rank-desc { font-size:0.8rem; color:rgba(0,0,0,0.50); margin-top:0.15rem; }

/* SVG line chart */
.rs-linechart-wrap { background:rgba(255,255,255,0.5); border:1px solid rgba(0,0,0,0.07); border-radius:12px; padding:1.25rem; overflow:hidden; }
.rs-linechart-wrap svg { width:100%; height:auto; overflow:visible; }

/* Quote / callout */
.rs-callout { background:linear-gradient(135deg,rgba(255,159,0,0.10),rgba(0,180,210,0.07)); border:1px solid rgba(255,159,0,0.25); border-radius:14px; padding:1.5rem; margin:1.5rem 0; }
.rs-callout-text { font-size:1.05rem; font-weight:600; color:rgba(0,0,0,0.82); line-height:1.55; font-style:italic; }
.rs-callout-attr  { font-size:0.78rem; color:#B06A00; margin-top:0.75rem; font-weight:600; }

/* Two-col layout for stats + chart */
.rs-two { display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:start; }
@media(max-width:768px){ .rs-two { grid-template-columns:1fr; gap:1.25rem; } }

/* Comparison table */
.rs-table { width:100%; border-collapse:collapse; margin:1.5rem 0; font-size:0.85rem; }
.rs-table th { background:rgba(255,159,0,0.10); color:#9A6000; font-weight:700; padding:0.75rem 1rem; text-align:left; border-bottom:1px solid rgba(255,159,0,0.25); font-size:0.8rem; text-transform:uppercase; letter-spacing:.04em; }
.rs-table td { padding:0.75rem 1rem; color:rgba(0,0,0,0.72); border-bottom:1px solid rgba(0,0,0,0.06); vertical-align:top; }
.rs-table tr:hover td { background:rgba(0,0,0,0.025); }
.rs-table .rs-badge { display:inline-block; padding:2px 8px; border-radius:4px; font-size:0.7rem; font-weight:700; }
.rs-badge.green { background:rgba(0,150,100,0.12); color:#006A46; }
.rs-badge.gold  { background:rgba(200,120,0,0.12); color:#9A6000; }
.rs-badge.cyan  { background:rgba(0,150,200,0.12); color:#006A90; }
@media(max-width:600px){ .rs-table { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; } }
                                                                                          