/* Shared About and Support design, matching the directory and profile pages. */
.info-page { margin: 0; padding: 0; --info-accent: #4dabf7; }
.info-hero { position: relative; overflow: hidden; padding: 9rem 0 5rem; background: radial-gradient(circle at 85% 35%, rgba(77,171,247,.22), transparent 32%), linear-gradient(135deg, #101820, #162532 55%, #16344a); }
.info-hero::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: 32px 32px; pointer-events: none; }
.info-hero .container { position: relative; z-index: 1; }
.info-badge { display: inline-flex; padding: .55rem .9rem; border: 1px solid rgba(77,171,247,.5); border-radius: 999px; background: rgba(77,171,247,.1); color: #80c4fa; font-weight: 700; letter-spacing: .03em; }
.info-hero h1 { color: #fff; font-size: clamp(2.5rem, 5vw, 4rem); }
.info-hero .lead { max-width: 760px; margin-inline: 0; color: rgba(255,255,255,.8); line-height: 1.75; }
.info-content { padding-top: 3rem; padding-bottom: 4rem; }
.info-page .feature-card, .info-content .card { border: 1px solid var(--bs-border-color); border-radius: 1rem; background: var(--bs-body-bg); box-shadow: 0 14px 35px rgba(0,0,0,.08); }
.info-page .feature-card p, .info-content .card-text { color: var(--bs-secondary-color); line-height: 1.75; }
.info-page .feature-icon, .info-content .card-title i { color: var(--info-accent) !important; }
.info-content .btn { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: .5rem; border-radius: .65rem; font-weight: 600; }
.info-content .btn-primary { background: #17669f; border-color: #17669f; color: #fff; }
.info-content .btn-outline-primary { color: #17669f; border-color: #17669f; }
.info-content .btn-primary:hover, .info-content .btn-outline-primary:hover { background: #125582; border-color: #125582; color: #fff; }
.info-content a:focus-visible { outline: 3px solid var(--info-accent); outline-offset: 4px; }
[data-bs-theme="dark"] .info-content .btn-outline-primary { color: #80c4fa; border-color: #80c4fa; }
[data-bs-theme="dark"] .info-content .btn-outline-primary:hover { color: #fff; background: #17669f; }
@media (max-width: 768px) { .info-hero { padding: 7rem 0 3rem; } .info-content { padding-top: 2rem; padding-bottom: 3rem; } }