* { box-sizing: border-box; }
html, body { max-width: 100%; margin: 0; padding: 0; }
body { font-family: "Nunito", "Segoe UI", Arial, sans-serif; background: #f5f6f8; color: #23272f; }

.container-fluid { max-width: 100%; padding: 0 24px; margin: 0 auto; }
.content-page { padding-top: 36px; padding-bottom: 20px; }

a { color: var(--sr-dark-light); }

.page-layout { display: grid; grid-template-columns: 280px 1fr 280px; gap: 32px; align-items: start; }

@media (max-width: 1500px) {
    .page-layout { grid-template-columns: 200px 1fr 200px; gap: 15px; }
}

@media (max-width: 1200px) {
    .page-layout { grid-template-columns: 1fr; }
}

.card { background: #fff; border-radius: 12px; box-shadow: 0 4px 18px rgba(20, 22, 31, .07); border: 1px solid #eee; overflow: hidden; }

.footer { border-top: 1px solid #e6e6e6; margin-top: 40px; padding-top: 24px; padding-bottom: 30px; text-align: center; }
.footer p { font-size: .82em; line-height: 1.65; max-width: 640px; margin: 0 auto; color: #6b7280; }

.hide { display: none !important; }

.back-to-top { position: fixed; right: 24px; bottom: 24px; width: 46px; height: 46px; border-radius: 50%; background: var(--sr-dark-2); color: #fff; align-items: center; justify-content: center; box-shadow: 0 10px 26px rgba(69,10,10,.35); text-decoration: none; z-index: 50; display: none; }
.back-to-top.show { display: flex; }
.back-to-top:hover { background: var(--sr-dark); color: #fff; }