@import url("/title-wrap-refine.css?v=20260906-title2");

.info-page .hero {
  margin-bottom: 20px;
}

.lang-content[hidden] {
  display: none !important;
}

.info-shell {
  display: grid;
  gap: 16px;
}

.info-panel {
  min-width: 0;
  padding: clamp(22px, 4vw, 34px);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--panel);
  box-shadow: 0 10px 35px rgba(0,0,0,.18);
}

.info-panel h2 {
  margin: 30px 0 10px;
  color: #eef0f7;
  font-size: clamp(20px, 3vw, 26px);
  letter-spacing: -.025em;
}

.info-panel h2:first-child {
  margin-top: 0;
}

.info-panel h3 {
  margin: 22px 0 8px;
  color: #e5e8f0;
  font-size: 16px;
}

.info-panel p,
.info-panel li {
  color: #b7becd;
  font-size: 14px;
  line-height: 1.85;
}

.info-panel p {
  margin: 8px 0;
}

.info-panel ul,
.info-panel ol {
  margin: 10px 0;
  padding-left: 22px;
}

.info-panel li + li {
  margin-top: 7px;
}

.info-panel a {
  max-width: 100%;
  color: #c5ceff;
  overflow-wrap: anywhere;
  text-decoration-color: rgba(197,206,255,.38);
  text-underline-offset: 3px;
}

.info-panel strong {
  color: #f0f2f8;
}

.info-meta {
  margin: 0 0 20px;
  color: #7f899c;
  font-size: 12px;
  font-weight: 750;
  letter-spacing: .02em;
}

.info-callout {
  min-width: 0;
  margin: 18px 0;
  padding: 15px 16px;
  border: 1px solid rgba(142,161,255,.18);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(142,161,255,.08), rgba(178,140,255,.045));
}

.info-callout p {
  margin: 0;
}

.site-footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 8px 0;
}

.site-footer-links a {
  color: #bdc8ff;
  text-decoration: none;
}

.site-footer-links a:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.info-page .hero h1 {
  max-width: 920px;
}

.info-page .hero p {
  max-width: 900px;
}

@media (max-width: 640px) {
  .info-panel {
    padding: 20px 18px;
  }

  .info-panel p,
  .info-panel li {
    font-size: 13px;
  }
}