#disclaimers h4{
color: #111B40;
}

.subnav-list{
border-left: 1px solid #ccc;
}


.btn-secondary:hover{
background-color: #152360;
color: #fff;

}


.blue-box{
background-color: rgba(246, 249, 252, 1); 
border-radius: 8px; 
padding: 3.5% 2%; 
margin: 1%;
}

.box-row{
padding-bottom: 2%;
}

#existing-benefits-continue img{
 width: 30%;
}

.grey-box{
background-color: rgba(246, 249, 252, 1); 
border-radius: 8px;
padding: 3%;
}

#rr-enroll-cc{
background-color: #152360;
padding: 4% 0; 
}

#rr-enroll-cc h2{
color: #fff;
padding-bottom: 1%;
}

#rr-enroll-cc p{
color: #fff;
}

.custom-gap-row {
  --gap-size: 16px;
  gap: var(--gap-size);
}

.swa-landing-page-content-detail .snav-link.active {
    background-color: #EEF6FF;
    border-left: 2px solid #111B40;
}


/*custom-gap-row > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}*/

/* MOBILE VIEW: 2 Columns */
@media (max-width: 767.98px) {
  .custom-gap-row > [class*="col-"] {
    /* 2 items per row means 1 gap total between them. 
       Each item subtracts half a gap (1/2) from 50% */
    flex: 0 0 calc(50% - (var(--gap-size) * 1 / 2));
    max-width: calc(50% - (var(--gap-size) * 1 / 2));
  }
.hide-on-desktop{
  display:block;
 }
}

/* DESKTOP VIEW: 4 Columns (Bootstrap 'md' breakpoint and up) */
@media (min-width: 768px) {
  .custom-gap-row > [class*="col-md-3"] {
    /* 4 items per row means 3 gaps total. 
       Each item subtracts 3/4 of a gap from 25% */
    flex: 0 0 calc(25% - (var(--gap-size) * 3 / 4));
    max-width: calc(25% - (var(--gap-size) * 3 / 4));
  }
 .hide-on-desktop{
  display:none;
 }
}


/* Custom positioning classes handled via jQuery toggles */
.is-fixed {
  position: fixed;
  top: 20px; /* Optional spacing offset from the top of the viewport */
  z-index: 1020;
}

.is-stopped {
  position: absolute;
  bottom: 0;
  top: auto;
}

/*mobile nav styling */ 

        .top-rr-sub-nav {
            background-color:#152360;
         }

         .topnav {
            --topnav-bg: #152360;
            --topnav-fg: #fff;
            --topnav-divider: rgba(255, 255, 255, 0.35);
            --topnav-hover: rgba(255, 255, 255, 0.15);
            --topnav-speed: 0.25s;

            width: 100%;
            background: var(--topnav-bg);
            color: var(--topnav-fg);
         }

         .topnav__links {
            display: flex;
            flex-wrap: wrap; /* wraps gracefully on narrow desktops/tablets */
            padding: 18px 0;
         }

         .swa-landing-page-content-detail .topnav__links a {
            color: #ffffff;
            flex: 1 1 auto;
            padding: 2px 16px;
            color: inherit;
            text-align: center;
            text-decoration: none;
            font-weight: 600;
            -webkit-tap-highlight-color: transparent;
            transition: background-color 0.15s;
         }

         .topnav__links a + a {
            border-left: 1px solid var(--topnav-divider);
         }

         .swa-landing-page-content-detail .topnav__links a:hover {
            background: var(--topnav-hover);
            text-decoration: none;
         }

         .topnav__links a:focus-visible,
         .topnav__toggle:focus-visible {
            outline: none;
            outline-offset: -4px;
            text-decoration: none;
         }


         .topnav__toggle {
            display: none;
         }  
         .topnav.no-anim,
         .topnav.no-anim * {
            transition: none !important;
         }

         @media (prefers-reduced-motion: reduce) {
            .topnav,
            .topnav * {
               transition: none !important;
            }
         }
         @media (max-width: 1180px) {
            .topnav__toggle {
               display: flex;
               align-items: center;
               justify-content: space-between;
               width: 100%;
               min-height: 48px;
               padding: 0 16px;
               background: transparent;
               border: none;
               color: inherit;
               cursor: pointer;
               -webkit-tap-highlight-color: transparent;
            }

            .topnav__toggle:focus {
               outline: none;
            }

            /* hamburger -> X */
            .topnav__icon {
               position: relative;
               width: 24px;
               height: 18px;
            }
            .topnav__icon span {
               position: absolute;
               left: 0;
               width: 100%;
               height: 2px;
               background: currentColor;
               border-radius: 2px;
               transition: transform var(--topnav-speed), top var(--topnav-speed), opacity 0.15s;
            }

            .topnav__icon span:nth-child(1) { 
               top: 0; 
            }

            .topnav__icon span:nth-child(2) { 
               top: 8px; 
            }
            
            .topnav__icon span:nth-child(3) { 
               top: 16px; 
            }

            .topnav.is-open .topnav__icon span:nth-child(1) { 
               top: 8px; transform: rotate(45deg); 
            }

            .topnav.is-open .topnav__icon span:nth-child(2) { 
               opacity: 0; 
            }

            .topnav.is-open .topnav__icon span:nth-child(3) { 
               top: 8px; transform: rotate(-45deg); 
            }

            /* vertical list */
            .topnav__links {
               flex-direction: column;
               flex-wrap: nowrap;
               padding: 0 16px 8px;
            }

            .swa-landing-page-content-detail .topnav__links a {
               min-height: 48px;
               display: flex;
               align-items: center;
               padding: 2px 0 2px 6px;
               border-top: 1px solid var(--topnav-divider);
            }

            .topnav__links a + a {
               border-left: 0;
            }

            /* the bar is the positioning anchor for the overlay */
            .topnav {
               position: relative;
            }

            .topnav .topnav__panel {
               position: absolute;
               top: 100%;
               left: 0;
               right: 0;
               z-index: 1000;
               max-height: 70vh;
               overflow-y: auto;
               background: var(--topnav-bg);
               box-shadow: 0 10px 20px rgba(0, 0, 0, 0.25);
               border-radius: 8px;

               /* closed */
               opacity: 0;
               transform: translateY(-8px);
               visibility: hidden; /* removes hidden links from tab order */
               pointer-events: none;
               transition: opacity var(--topnav-speed) ease,
                           transform var(--topnav-speed) ease,
                           visibility 0s linear var(--topnav-speed);
            }

            .topnav.is-open .topnav__toggle {
               justify-content: flex-end;
               
            }

            .topnav.is-open .topnav__label {
               display: none;
            }

            .topnav.is-open .topnav__panel {
               opacity: 1;
               transform: translateY(0);
               visibility: visible;
               pointer-events: auto;
               transition: opacity var(--topnav-speed) ease,
                           transform var(--topnav-speed) ease,
                           visibility 0s;
            }

            .topnav.no-anim,
            .topnav.no-anim * {
               transition: none !important;
            }
         }

/* Timeline CSS */ 

.main-timeline-section {
  --tl-blue: #304CB2;
  --tl-navy: #152360;
  --tl-sky: #00BFFF;
  --tl-line: 20px;     /* thickness of the bar */
  --tl-icon: 44px;     /* icon badge size */
  position: relative;
  width: 100%;
  margin: auto;
  box-sizing: border-box;
}
.main-timeline-section *,
.main-timeline-section *::before,
.main-timeline-section *::after { box-sizing: border-box; }

/* start / end caps */
.main-timeline-section .timeline-start,
.main-timeline-section .timeline-end {
  position: absolute;
  width: 30px;
  height: 30px;
  background: var(--tl-blue);
  border: 3px solid #FFF;
  border-radius: 100px;
  z-index: 10;
}

.main-timeline-section .timeline-end { display: none; }
/* the bar */
.main-timeline-section .conference-center-line {
  position: absolute;
  border-radius: 10px;
}

.timeline-article { position: relative; }
.timeline-article .content-date {
  font-size: 18px;
  font-weight: 700;
  color: var(--tl-navy);
}

/* icon badge (replaces the dot) */
.timeline-article .meta-date {
  position: relative;
  z-index: 5;
  width: var(--tl-icon);
  height: var(--tl-icon);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 3px solid #FFF;
  background: var(--tl-sky);
  color: #FFF;
  box-shadow: 0 1px 4px rgba(0, 0, 0, .25);
}
.timeline-article .meta-date svg {
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.timeline-article .meta-date.is-platinum  { background: #5B7BD5; }
.timeline-article .meta-date.is-gold      { background: #C9A24B; }
.timeline-article .meta-date.is-silver    { background: #8E97A6; }
.timeline-article .meta-date.is-milestone { background: var(--tl-sky); }
.timeline-article .meta-date.is-start     { background: var(--tl-navy); }

.timeline-article .content-box {
  border-radius: 5px;
  background: #FFF;
  color: #1F1F1F;
  text-align: center;
padding: 4%;
 
}
.timeline-article .content-box p { margin: 0; font-size: .9rem; }
.timeline-article .content-box.is-dark {
  background: var(--tl-navy);
  border-color: var(--tl-navy);
  color: #FFF;
}

/* ---------- MOBILE: vertical (default) ---------- */
.main-timeline-section { padding: 15px 0 0; }

.main-timeline-section .timeline-start { top: 0;    left: 9px; }
.main-timeline-section .timeline-end   { bottom: 0; left: 3px; }

.main-timeline-section .conference-center-line {
  top: 15px;
  bottom: 36px;
  left: 14px;                      /* centres the 20px bar on the 30px caps */
  width: var(--tl-line);
  height: auto;
  background: linear-gradient(180deg, #304CB2 0%, #EEF6FF 25%, #E5CFA3 75%, #B4AC9F 100%);
}

.conference-timeline-content {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.timeline-article {
  display: grid;
  grid-template-columns: var(--tl-icon) 1fr;
  grid-template-areas:
    "icon box"
    "icon date";
  column-gap: 16px;
  align-items: center;
  padding-left: 2px;               /* optically centres the badge on the bar */
}
.timeline-article .meta-date    { grid-area: icon; align-self: center; }
.timeline-article .content-date { grid-area: date; align-self: end; }
.timeline-article .content-box  { grid-area: box;  align-self: start; text-align: left; justify-self: start;  }

/* ---------- TABLET + DESKTOP: horizontal ---------- */
@media (min-width: 768px) {
  .main-timeline-section {
    height: 250px;
    padding: 0 40px
  }

  .main-timeline-section .timeline-start,
  .main-timeline-section .timeline-end {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
  }
  .main-timeline-section .timeline-start { left: 0; }
  .main-timeline-section .timeline-end   { left: auto; right: 0; }

  .main-timeline-section .conference-center-line {
    top: 50%;
    bottom: auto;
    left: 15px;
    right: 90px;
    width: auto;
    height: var(--tl-line);
    transform: translateY(-50%);
    background: linear-gradient(90deg, #304CB2 0%, #EEF6FF 25%, #E5CFA3 75%, #B4AC9F 100%);
  }

  .conference-timeline-content {
    flex-direction: row;
    gap: 0;
    height: 100%;
  }

  .timeline-article {
    flex: 1 1 0;
    min-width: 0;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr var(--tl-icon) 1fr;   /* icon row sits dead-centre on the bar */
    grid-template-areas:
      "box"
      "icon"
      "date";
    row-gap: 0;
    justify-items: center;
    padding-left: 0;
  }
  .timeline-article .content-date { align-self: start; padding-bottom: 14px; }
  .timeline-article .content-box {
    align-self: center;
    justify-self: center;
    margin-top: 22px;
    text-align: center;
    position: relative;
  }

  /* last column has zero width so the platinum icon sits at the very end of the bar */
  .timeline-article:last-child {
    flex: 1 1 0;
    justify-content: center;
    min-height: 0;
  }
  .timeline-article:last-child .content-date { white-space: nowrap; }
  .timeline-article:last-child .content-box {  max-width: none; padding: 4%; border-radius: 5px;}

  /* little connector between icon and box */
  .timeline-article .content-box::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 31px;
    height: 54px;
    border-left: 2px solid #1F1F1F;
    transform: translateX(-50%);
    z-index: -100;
  }
}


/* Bordered CTA */

.rr-bordered-cta {
 display: flex;
 align-items: center;
 justify-content: center;

 width: calc(100% - 96px);
 margin: 12px 0;
 padding: 18px 13px;
 box-sizing: border-box;

 background: #fff;
 border: 2px solid #152360;
 border-radius: 12px;

 color: #152360;
 font-size: 1.2rem;
 font-weight: 700;
 line-height: 1.2;
 text-align: center;
 text-decoration: none;

 cursor: pointer;
 transition: background-color 0.2s ease;
}

.rr-bordered-cta a {
 color: #152360 !important;
}

.rr-bordered-cta:hover {
 text-decoration: underline;
}

.rr-bordered-cta:focus-visible {
 outline: 3px solid #304cb2;
 outline-offset: 4px;
}

@media (max-width: 767px) {
 .rr-bordered-cta {
   width: calc(100% - 32px);
   min-height: auto;
   margin: 15px 0;

   border-width: 3px;
   border-radius: 10px;
 }
}

/* Hero img */ 
@media (max-width: 768px) {
    .rr-hero-section img {
        display: block !important;
   padding-top: 4%;
    }
}

