/* STUDY_DESIGN_SYSTEM_OFICIAL_V2 */

:root{
  --study-bg:#0D1117;
  --study-bg-secondary:#161B22;
  --study-card:#21262D;
  --study-primary:#6B1D2B;
  --study-primary-hover:#8F2D3F;
  --study-cta:#F59E0B;
  --study-cta-hover:#FACC15;
  --study-success:#22C55E;
  --study-info:#94A3B8;
  --study-text:#FFFFFF;
  --study-text-secondary:#CBD5E1;
  --study-radius:12px;
  --study-font:Inter,Poppins,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}

*{box-sizing:border-box}

html,body{
  background:var(--study-bg);
  color:var(--study-text);
  font-family:var(--study-font);
}

.study-ds-page{
  min-height:100vh;
  margin:0;
  background:
    radial-gradient(circle at top left, rgba(245,158,11,.08), transparent 28%),
    linear-gradient(180deg,var(--study-bg),#10151f);
}

.study-ds-wrap{
  max-width:1120px;
  margin:0 auto;
  padding:32px 20px;
}

.study-ds-card{
  background:var(--study-bg-secondary);
  border:1px solid var(--study-card);
  border-radius:12px;
  padding:24px;
  margin-bottom:16px;
  transition:all .25s ease;
}

.study-ds-card:hover{
  border-color:var(--study-cta);
  transform:translateY(-2px);
}

.study-ds-page h1{
  font-size:32px;
  font-weight:700;
  margin:0 0 12px;
}

.study-ds-page h2{
  font-size:24px;
  font-weight:700;
  margin:0 0 12px;
}

.study-ds-page h3{
  font-size:20px;
  font-weight:600;
  margin:0 0 8px;
}

.study-ds-page p,
.study-ds-page li{
  font-size:14px;
  color:var(--study-text-secondary);
  line-height:1.6;
}

.study-ds-badge{
  display:inline-block;
  background:rgba(245,158,11,.15);
  color:var(--study-cta);
  border-radius:999px;
  padding:6px 10px;
  font-size:12px;
  font-weight:700;
  margin-bottom:12px;
}

.study-ds-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}

.study-ds-palette{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
}

.study-ds-swatch{
  min-height:90px;
  border-radius:10px;
  border:1px solid var(--study-card);
  padding:14px;
}

.study-ds-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:11px 14px;
  border-radius:8px;
  background:var(--study-primary);
  color:#fff;
  text-decoration:none;
  font-weight:700;
  margin:6px 6px 0 0;
}

.study-ds-btn:hover{
  background:var(--study-primary-hover);
}

.study-ds-btn-cta{
  background:var(--study-cta);
  color:#fff;
}

.study-ds-btn-cta:hover{
  background:var(--study-cta-hover);
  color:var(--study-bg);
}

@media(max-width:760px){
  .study-ds-grid,
  .study-ds-palette{
    grid-template-columns:1fr;
  }

  .study-ds-wrap{
    padding:20px 14px;
  }
}
