.visually-hidden {
      position:absolute !important; 
      width:1px; height:1px; 
      padding:0; margin:-1px; 
      overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
    }
    /* Optional: make skip link visible when focused */
    .skip-link {
      position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;
    }
    .skip-link:focus {
      position:static; width:auto; height:auto; margin:1rem 0; padding:.5rem 1rem;
      outline:2px solid; /* uses default colors; ensure visible */
    }
    
    /* Visually hidden helper */
.vh {
  position:absolute!important; width:1px; height:1px; margin:-1px; padding:0;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* Accessible red + not color-only */
.text-important {
  font-weight: 700;
  color: #B71C1C;            /* deep red with strong contrast on white */
}

/* Optional icon accent that’s decorative (hidden from SR via aria-hidden) */
.important-icon {
  display:inline-block;
  margin-right:.35rem;
  font-weight:900;
  line-height:1;
  color:#B71C1C;
  /* if you prefer a dot instead of “!” use: content:'' on ::before with a circle */
}

/* colors: dark red text, very light red background */
.important-bullet {
  list-style: none;                 /* avoids double bullet + custom marker */
  margin-left: 0;                   /* align with other bullets */
  padding: .5rem .75rem .5rem .75rem;
  border-left: 4px solid #B71C1C;   /* deep red (passes contrast) */
  background: #FDEBEB;              /* light red tint; still readable */
  border-radius: 4px;
}
.important-bullet .text-important { color:#B71C1C; font-weight:700; }
.important-bullet .important-icon { margin-right:.35rem; font-weight:900; }
@media (forced-colors: active){ .important-bullet{ forced-color-adjust:auto; } }


/* Respect high-contrast/forced-colors modes */
@media (forced-colors: active) {
  .text-important,
  .important-icon,
  .important-bullet { 
    forced-color-adjust: auto;  /* let the OS choose strong contrast colors */
  }
}

 /* Visually hidden but focusable */
    .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
    
    .rep-group { margin-top: 1rem; }
    .rep-tile { position: relative; cursor: pointer; border: 2px solid transparent; padding: 20px; transition: all .2s ease-in-out; }
    .rep-tile:hover, .rep-tile[aria-pressed="true"], .rep-tile--selected {
      border: 3px solid #1F74DB !important;
      background-color: rgba(31,116,219,.10) !important;
    }
    .rep-radio { position: absolute; opacity: 0; width:1px; height:1px; }
    .checkmark-icon { position:absolute; top:10px; right:10px; font-size:20px; }
    .checkmark-icon[aria-hidden="true"] { /* icon is decorative for AT */
      color: #1F74DB;
      opacity: 0;
      transition: opacity .2s;
    }
    .rep-tile--selected .checkmark-icon[aria-hidden="true"] { opacity: 1; }

    /* Keep focus outlines visible */
    .rep-tile:focus-within { outline: 3px solid #000; outline-offset: 2px;