.sol-home{background:#09070f}
.sol-banner{
  position:relative;
  height:210px;
  overflow:hidden;
  border-bottom:1px solid rgba(229,201,139,.15);
  background:#0b0912;
}
.sol-banner img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 48%;
  filter:saturate(1.03) contrast(1.02);
}
.sol-banner:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,rgba(8,6,14,.12),transparent 28%,transparent 72%,rgba(8,6,14,.14));
}
.guide-home{
  width:min(1120px,calc(100% - 40px));
  margin:0 auto;
  padding:30px 0 76px;
}
.guide-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  padding-bottom:20px;
  border-bottom:1px solid rgba(221,204,255,.12);
}
.guide-heading h1{
  margin:0;
  font-family:Inter,Pretendard,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:34px;
  line-height:1.15;
  letter-spacing:-.045em;
}
.guide-heading p{
  max-width:570px;
  margin:0;
  color:#a99fb9;
  font-size:13px;
  line-height:1.7;
}
.guide-status{
  display:flex;
  gap:7px;
  flex-wrap:wrap;
  margin-top:13px;
}
.guide-status span{
  padding:5px 8px;
  border-radius:999px;
  border:1px solid rgba(221,204,255,.12);
  color:#a99db9;
  font-size:10px;
  background:rgba(20,15,34,.5);
}
.guide-section{padding-top:31px}
.guide-section-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:13px;
}
.guide-section-head h2{
  margin:0;
  font-size:21px;
  letter-spacing:-.035em;
}
.guide-section-head span{
  color:#7f758f;
  font-size:11px;
}
.guide-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}
.guide-card{
  position:relative;
  min-height:138px;
  padding:17px;
  border-radius:15px;
  border:1px solid rgba(221,204,255,.12);
  background:linear-gradient(155deg,rgba(24,19,42,.93),rgba(12,9,20,.96));
  transition:.18s ease;
}
.guide-card:hover{
  transform:translateY(-2px);
  border-color:rgba(231,198,125,.32);
  box-shadow:0 14px 34px rgba(0,0,0,.2);
}
.guide-card b{
  display:block;
  margin:3px 0 5px;
  font-size:17px;
  letter-spacing:-.025em;
}
.guide-card p{
  margin:0;
  color:#9f94ae;
  font-size:12px;
  line-height:1.6;
}
.guide-card .mini{
  color:#d8bb7b;
  font-size:9px;
  font-weight:900;
  letter-spacing:.12em;
}
.guide-card .arrow{
  position:absolute;
  right:14px;
  bottom:13px;
  color:#b9a6e6;
  font-size:11px;
}
.guide-card.featured{
  border-color:rgba(231,198,125,.22);
  background:
    radial-gradient(circle at 100% 0,rgba(142,105,214,.14),transparent 40%),
    linear-gradient(155deg,rgba(28,21,47,.96),rgba(13,10,21,.97));
}
.guide-update{
  display:grid;
  grid-template-columns:1fr auto;
  gap:20px;
  align-items:center;
  padding:17px 18px;
  border-radius:15px;
  border:1px solid rgba(231,198,125,.16);
  background:rgba(24,18,35,.7);
}
.guide-update strong{display:block;margin-bottom:3px;font-size:15px}
.guide-update p{margin:0;color:#9f94ae;font-size:11px}
.guide-update a{
  padding:8px 11px;
  border-radius:999px;
  border:1px solid rgba(231,198,125,.25);
  color:#ecd59e;
  font-size:11px;
  font-weight:800;
}
.guide-note{
  margin-top:26px;
  padding-top:19px;
  border-top:1px solid rgba(221,204,255,.1);
  color:#756d81;
  font-size:11px;
}
@media(max-width:900px){
  .guide-grid{grid-template-columns:repeat(2,1fr)}
  .guide-heading{align-items:flex-start;flex-direction:column}
}
@media(max-width:620px){
  .sol-banner{height:150px}
  .sol-banner img{object-position:center 50%}
  .guide-home{width:calc(100% - 24px);padding-top:23px}
  .guide-heading h1{font-size:28px}
  .guide-grid{grid-template-columns:1fr}
  .guide-update{grid-template-columns:1fr}
}