:root{
  --headline:#304862;
  --hover:#de4640;
  --text:#4d647e;
  --border:#e0e6ec;
  --shadow:0 14px 32px rgba(48,72,98,.16);
  --radius:18px;
}

body{
  font-family:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  background:#f4f6fa;
  margin:0;
  color:var(--text);
}

.about-container{
  width:min(1200px,94%);
  margin:0 auto;
}

.about-hero{
  padding:3rem 0 1.5rem;
  text-align:center;
}

.about-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  padding:2rem 2.4rem;
  margin-bottom:2rem;
  transition:transform .18s ease,box-shadow .18s ease;
}

.about-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 42px rgba(48,72,98,.22);
}

.about-card--intro{
  background:linear-gradient(135deg,#ffffff,#eef3fb);
}

.card-title{
  text-align:center;
  color:var(--headline);
  font-weight:700;
  font-size:1.7rem;
  margin:0 0 1rem;
}

.card-content{
  text-align:justify;
  font-size:1.05rem;
  line-height:1.8;
}

.centered-content{
  text-align:center;
}

.social-row{
  display:flex;
  justify-content:center;
  gap:2.2rem;
  flex-wrap:wrap;
  margin-top:1rem;
}

.social-item{
  display:flex;
  align-items:center;
  gap:.5rem;
  text-decoration:none;
  color:var(--headline);
  font-weight:700;
}

.social-item:hover{
  color:var(--hover);
}

.social-icon{
  width:28px;
  height:28px;
  background:#eef3fb;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
}

.social-icon svg{
  width:15px;
  height:15px;
  fill:currentColor;
}

.rss-badge{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.5rem .8rem;
  margin-top:.8rem;
  border-radius:999px;
  background:#fff7e8;
  border:1px solid #ffd9a3;
  font-weight:600;
  color:#c26b1a;
  text-decoration:none;
}

.rss-badge:hover{
  background:#ffe7c2;
}

.rss-icon svg{
  width:16px;
  height:16px;
}