*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  max-width: 100%;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
}

body:not(.home) {
  width: min(100%, 1120px);
  max-width: 1120px;
  min-height: 100vh;
  margin: 0 auto !important;
  padding: clamp(18px, 4vw, 42px) clamp(16px, 5vw, 56px) 48px !important;
  overflow-wrap: anywhere;
  background: #f4f7fb !important;
  color: #243248 !important;
  font-family: "Noto Sans Devanagari", "Segoe UI", Arial, sans-serif !important;
  font-size: 16px;
  line-height: 1.8 !important;
  -webkit-font-smoothing: antialiased;
}

body:not(.home) > header,
body:not(.home) > h1:first-child {
  margin: 0 0 24px !important;
  padding: clamp(20px, 4vw, 34px) !important;
  border: 1px solid #243f68 !important;
  border-radius: 18px !important;
  background: linear-gradient(120deg, #10233f, #284a78) !important;
  color: #fff !important;
  box-shadow: 0 12px 28px rgb(16 35 63 / 13%);
  text-align: left !important;
}

body:not(.home) > header h1,
body:not(.home) > h1:first-child {
  color: #fff !important;
  font-size: clamp(1.55rem, 4vw, 2.25rem) !important;
  line-height: 1.45;
}

body:not(.home) h1,
body:not(.home) h2,
body:not(.home) h3,
body:not(.home) h4 {
  overflow-wrap: anywhere;
}

body:not(.home) h2 {
  margin: 28px 0 12px;
  color: #17365f !important;
  font-size: clamp(1.2rem, 3vw, 1.55rem);
  line-height: 1.55;
}

body:not(.home) h3 {
  color: #285391 !important;
  font-size: 1.12rem;
}

body:not(.home) p,
body:not(.home) li {
  overflow-wrap: anywhere;
}

body:not(.home) p {
  margin-top: 10px;
  margin-bottom: 12px;
}

body:not(.home) li {
  padding-inline-start: 2px;
  margin-block: 5px;
}

body:not(.home) a {
  color: #285bb9;
  text-underline-offset: 3px;
}

body:not(.home) a:hover {
  color: #183e87;
}

body:not(.home) .card,
body:not(.home) .mcq,
body:not(.home) article,
body:not(.home) .content-card {
  padding: clamp(16px, 3vw, 24px) !important;
  margin: 16px 0 !important;
  border: 1px solid #e1e8f1 !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 4px 14px rgb(26 47 78 / 5%);
}

body:not(.home) .card h2:first-child,
body:not(.home) article h2:first-child {
  margin-top: 0;
}

body:not(.home) .note,
body:not(.home) .tip,
body:not(.home) .ped,
body:not(.home) .ok,
body:not(.home) .explain,
body:not(.home) blockquote {
  padding: 13px 16px !important;
  margin: 14px 0 !important;
  border: 1px solid #dbe7f8;
  border-left: 4px solid #5683d5 !important;
  border-radius: 9px !important;
  background: #f1f6ff !important;
  color: #344966 !important;
}

body:not(.home) .tip,
body:not(.home) .note {
  border-color: #f1e1bb;
  border-left-color: #d99a31 !important;
  background: #fff9eb !important;
}

body:not(.home) .ok {
  border-color: #cde8d8;
  border-left-color: #38a16c !important;
  background: #eff9f3 !important;
}

body:not(.home) .toc a {
  display: block;
  padding: 7px 10px;
  border-radius: 7px;
  text-decoration: none;
}

body:not(.home) .toc a:hover {
  background: #f1f5fc;
}

body:not(.home) .tag {
  padding: 4px 10px;
  border: 1px solid #e0e7f2;
  background: #f3f6fb;
}

body:not(.home) table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  -webkit-overflow-scrolling: touch;
}

body:not(.home) th,
body:not(.home) td {
  min-width: 100px;
  padding: 10px 12px;
  border: 1px solid #dfe6ef;
  text-align: left;
}

body:not(.home) th {
  background: #edf3fc;
  color: #17365f;
}

body:not(.home) img,
body:not(.home) video,
body:not(.home) iframe,
body:not(.home) svg {
  max-width: 100%;
}

body:not(.home) img,
body:not(.home) video,
body:not(.home) iframe {
  height: auto;
}

body:not(.home) pre,
body:not(.home) code {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

body:not(.home) code {
  padding: 2px 6px;
  border-radius: 5px;
  background: #edf1f7;
  color: #334666;
}

body:not(.home) footer {
  padding-top: 18px;
  margin-top: 28px;
  border-top: 1px solid #dfe6ef;
  color: #718096 !important;
}

@media (max-width: 700px) {
  body:not(.home) {
    padding: 14px 12px 30px !important;
    font-size: 15px;
  }

  body:not(.home) > header,
  body:not(.home) > h1:first-child {
    padding: 19px 17px !important;
    margin-bottom: 17px !important;
    border-radius: 13px !important;
  }

  body:not(.home) .card,
  body:not(.home) .mcq,
  body:not(.home) article,
  body:not(.home) .content-card {
    padding: 14px !important;
    margin: 12px 0 !important;
  }

  body:not(.home) .two-col,
  body:not(.home) .three-col,
  body:not(.home) .grid-2,
  body:not(.home) .grid-3,
  body:not(.home) .row,
  body:not(.home) [style*="grid-template-columns"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

@media (min-width: 701px) and (max-width: 1024px) {
  body:not(.home) [style*="grid-template-columns"] {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)) !important;
  }
}
