/* Reusable compatibility layer for a new Knights informational page.
   It is intentionally scoped to .ka-info-page and must be integrated into a
   fresh authenticated page shell only after durable access and backup. */

.ka-info-page,
.ka-info-page * {
  box-sizing: border-box;
}

.ka-info-page {
  width: 100%;
  max-width: 760px;
  margin: 0 auto;
  padding: 30px 36px 46px;
  color: #252525;
  background: #ffffff;
  font: 16px/1.68 Arial, Helvetica, sans-serif;
  overflow-wrap: anywhere;
}

.ka-info-header {
  margin-bottom: 24px;
  padding-bottom: 18px;
  border-bottom: 4px solid #b3261e;
}

.ka-info-kicker {
  margin: 0 0 8px;
  color: #8b1d17;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.ka-info-page h1 {
  margin: 0;
  color: #171717;
  font-size: clamp(2rem, 5vw, 3rem);
  line-height: 1.1;
}

.ka-info-deck {
  margin: 13px 0 0;
  color: #4b4b4b;
  font-size: 1.12rem;
  line-height: 1.45;
}

.ka-info-page h2 {
  margin: 38px 0 12px;
  color: #8b1d17;
  font-size: 1.55rem;
  line-height: 1.22;
}

.ka-info-page p,
.ka-info-page li {
  max-width: 70ch;
}

.ka-info-page a {
  color: #8b1d17;
  font-weight: 400;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}

.ka-info-page a:hover {
  color: #b3261e;
  text-decoration-thickness: 2px;
}

.ka-info-page a:focus-visible {
  outline: 3px solid #f3b61f;
  outline-offset: 3px;
}

.ka-info-page ol {
  margin: 16px 0 22px;
  padding-left: 1.35rem;
}

.ka-info-page li + li {
  margin-top: 10px;
}

.ka-info-figure {
  margin: 28px 0 34px;
}

.ka-info-figure img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  border-radius: 2px;
}

.ka-info-figure figcaption {
  margin-top: 9px;
  color: #5b5b5b;
  font-size: 0.88rem;
  line-height: 1.45;
}

@media (max-width: 760px) {
  html,
  body {
    margin: 0 !important;
    padding: 0 !important;
  }

  html,
  body,
  #page,
  #header,
  #hero,
  #contentTop,
  #footerWrapper,
  #footer,
  #yellFooter,
  .header,
  .navigation,
  .social,
  .row,
  .row.fullWidth,
  .contents,
  .contents.overlay,
  .contents.callToAction,
  .column.grid16.left.last,
  .column.grid24.left.last {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .column.grid16.left.last,
  .column.grid24.left.last,
  .contents,
  .contents.overlay,
  .contents.callToAction {
    float: none !important;
    left: auto !important;
    right: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .navigation {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: stretch !important;
    float: none !important;
    height: auto !important;
    min-height: 0 !important;
  }

  .navigation > li {
    flex: 0 0 auto !important;
    float: none !important;
  }

  #contentTop {
    clear: both !important;
  }

  img,
  video,
  iframe {
    max-width: 100% !important;
    height: auto;
  }

  .ka-info-page {
    margin: 0;
    padding: 22px 18px 36px;
    font-size: 16px;
    line-height: 1.62;
  }

  .ka-info-page h1 {
    font-size: clamp(1.85rem, 9vw, 2.45rem);
  }

  .ka-info-page h2 {
    margin-top: 32px;
    font-size: 1.4rem;
  }
}

/* Native header elements flow separately on narrow screens. */
@media(max-width:760px){
 #header{height:auto!important;min-height:0!important;padding:12px 0 0!important}
 #header .logo{position:static!important;float:none!important;width:calc(100% - 36px)!important;max-width:320px!important;height:auto!important;margin:0 auto!important}
 #header .logo a{display:block}
 #header .logo img{width:100%!important;height:auto!important;max-width:100%!important}
 #header .strap{position:static!important;float:none!important;width:auto!important;max-width:100%!important;margin:10px 18px!important;text-align:center!important}
 #header .strap p{text-align:center!important;margin:3px 0!important;white-space:normal!important}
 #header .navigation{position:relative!important;clear:both!important;top:auto!important;left:auto!important;right:auto!important;margin-top:12px!important}
}

/* One shared editorial rule set; controls retain their native styling. */
#contentTop :is(p,li,td,figcaption,blockquote) a:where(:not([role="button"]):not(.button):not(.btn):not([href^="tel:"]):not([href^="mailto:"])),.dmContent .dmNewParagraph a:where(:not([role="button"]):not(.button):not(.btn)){font-weight:400!important;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
#contentTop :is(p,li,td,figcaption,blockquote) a:where(:not([role="button"]):not(.button):not(.btn):not([href^="tel:"]):not([href^="mailto:"])) :is(strong,b),.dmContent .dmNewParagraph a:where(:not([role="button"]):not(.button):not(.btn)) :is(strong,b){font-weight:400!important}
#contentTop :is(p,li,td,figcaption,blockquote) a:where(:not([role="button"]):not(.button):not(.btn):not([href^="tel:"]):not([href^="mailto:"])){color:#78bbff}
#contentTop :is(p,li,td,figcaption,blockquote) a:where(:not([role="button"]):not(.button):not(.btn):not([href^="tel:"]):not([href^="mailto:"])):hover{color:#b3d9ff;text-decoration-thickness:2px}
#contentTop :is(p,li,td,figcaption,blockquote) a:where(:not([role="button"]):not(.button):not(.btn):not([href^="tel:"]):not([href^="mailto:"])):focus-visible{outline:2px solid #78bbff;outline-offset:3px}
#contentTop .ka-info-page :is(p,li,td,figcaption,blockquote) a:where(:not([role="button"]):not(.button):not(.btn):not([href^="tel:"]):not([href^="mailto:"])),.dmContent .dmNewParagraph a:where(:not([role="button"]):not(.button):not(.btn)){color:#0066cc}
#contentTop .ka-info-page :is(p,li,td,figcaption,blockquote) a:where(:not([role="button"]):not(.button):not(.btn):not([href^="tel:"]):not([href^="mailto:"])):hover,.dmContent .dmNewParagraph a:where(:not([role="button"]):not(.button):not(.btn)):hover{color:#00478f;text-decoration-thickness:2px}
#contentTop .ka-info-page :is(p,li,td,figcaption,blockquote) a:where(:not([role="button"]):not(.button):not(.btn):not([href^="tel:"]):not([href^="mailto:"])):focus-visible,.dmContent .dmNewParagraph a:where(:not([role="button"]):not(.button):not(.btn)):focus-visible{outline:2px solid #0066cc;outline-offset:3px}
.ka-info-page figure img{display:block;max-width:100%;width:100%;height:auto}
