/* Employment Plan site navigation */
.ep-site-header{
  --navy:#09275b;
  --blue:#1d5fc7;
  --gold:#f2ad24;
  --cream:#fffdf9;

  width:100%;
  position:relative;
  z-index:1000;
  background:var(--cream);
  border-bottom:1px solid rgba(9,39,91,.10);
}

.ep-site-header *{
  box-sizing:border-box;
}

.ep-nav-inner{
  width:min(1320px,100%);
  min-height:78px;
  margin:0 auto;
  padding:0 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}

.ep-brand{
  color:var(--navy);
  text-decoration:none;
  font-size:25px;
  font-weight:800;
  letter-spacing:-1px;
  white-space:nowrap;
}

.ep-brand span{
  font-weight:500;
}

/* ---------- DESKTOP MENU ---------- */

.ep-menu{
  display:flex;
  align-items:center;
  gap:4px;
}

.ep-menu>a,
.ep-dropdown-button{
  position:relative;
  padding:28px 15px;
  border:0;
  background:transparent;
  color:var(--navy);
  text-decoration:none;
  font:inherit;
  font-size:15px;
  font-weight:700;
  cursor:pointer;
}

.ep-menu>a::after,
.ep-dropdown-button::after{
  content:"";
  position:absolute;
  left:15px;
  right:15px;
  bottom:18px;
  height:3px;
  border-radius:10px;
  background:var(--gold);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .2s ease;
}

.ep-menu>a:hover::after,
.ep-menu>a:focus-visible::after,
.ep-dropdown-button:hover::after,
.ep-dropdown-button:focus-visible::after{
  transform:scaleX(1);
}

.ep-menu>a:focus-visible,
.ep-dropdown-button:focus-visible{
  outline:3px solid rgba(29,95,199,.28);
  outline-offset:2px;
  border-radius:6px;
}

.ep-dropdown{
  position:relative;
}

.ep-dropdown-button{
  display:flex;
  align-items:center;
  gap:7px;
}

.ep-dropdown-button span{
  font-size:17px;
  line-height:1;
  transition:transform .2s ease;
}

.ep-dropdown:hover .ep-dropdown-button span,
.ep-dropdown.ep-dropdown-open .ep-dropdown-button span{
  transform:rotate(180deg);
}

/* Desktop dropdown */
.ep-dropdown-menu{
  position:absolute;
  top:calc(100% - 8px);
  left:50%;

  min-width:220px;
  padding:9px;

  background:#fff;
  border:1px solid rgba(9,39,91,.08);
  border-radius:12px;
  box-shadow:0 18px 45px rgba(9,39,91,.14);

  transform:translate(-50%,-8px) scale(.97);
  opacity:0;
  visibility:hidden;

  transition:
    opacity .18s ease,
    transform .18s ease,
    visibility .18s ease;
}

.ep-dropdown:hover .ep-dropdown-menu,
.ep-dropdown:focus-within .ep-dropdown-menu,
.ep-dropdown.ep-dropdown-open .ep-dropdown-menu{
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0) scale(1);
}

.ep-dropdown-menu a{
  display:block;
  padding:12px 14px;
  border-radius:8px;
  color:#17243a;
  text-decoration:none;
  font-size:14px;
  font-weight:600;
  transition:background .15s ease,color .15s ease;
}

.ep-dropdown-menu a:hover,
.ep-dropdown-menu a:focus-visible{
  background:#fbf5ec;
  color:var(--blue);
  outline:none;
}

/* ---------- MOBILE MENU BUTTON ---------- */

.ep-menu-toggle{
  display:none;
  width:44px;
  height:44px;
  padding:6px;
  border:0;
  border-radius:8px;
  background:transparent;
  cursor:pointer;
}

.ep-menu-toggle:hover{
  background:#fbf5ec;
}

.ep-menu-toggle:focus-visible{
  outline:3px solid rgba(29,95,199,.28);
  outline-offset:2px;
}

.ep-menu-toggle span{
  display:block;
  width:23px;
  height:2px;
  margin:5px auto;
  background:var(--navy);
  transition:transform .2s ease,opacity .2s ease;
}


/* =========================================================
   MOBILE NAVIGATION
   ========================================================= */

@media(max-width:760px){

  .ep-nav-inner{
    min-height:68px;
    padding:0 20px;
  }

  .ep-menu-toggle{
    display:block;
  }

  /*
     Main mobile menu.
     It is deliberately contained inside the viewport.
  */
  .ep-menu{
    position:absolute;
    left:12px;
    right:12px;
    top:calc(100% + 8px);

    display:none;
    flex-direction:column;
    align-items:stretch;
    gap:0;

    padding:10px;

    background:#fff;
    border:1px solid rgba(9,39,91,.07);
    border-radius:14px;
    box-shadow:0 18px 45px rgba(9,39,91,.15);

    /*
      Prevent any child from creating horizontal overflow.
    */
    overflow:hidden;
  }

  .ep-menu.ep-menu-open{
    display:flex;
  }

  .ep-menu>a,
  .ep-dropdown-button{
    width:100%;
    padding:14px 15px;
    text-align:left;
  }

  .ep-menu>a::after,
  .ep-dropdown-button::after{
    display:none;
  }

  /* Make Services occupy the full mobile-menu width */
  .ep-dropdown{
    position:relative;
    width:100%;
  }

  /*
     IMPORTANT:
     Completely reset the desktop dropdown positioning.
     On mobile this becomes a normal element in the menu.
  */
  .ep-dropdown-menu{
    position:static;

    display:none;

    width:100%;
    min-width:0;

    margin:0;
    padding:0 0 5px;

    border:0;
    border-radius:0;
    box-shadow:none;

    transform:none !important;
    opacity:1;
    visibility:visible;

    transition:none;
  }

  /*
     Only the JavaScript "open" class controls the
     submenu on mobile.
  */
  .ep-dropdown.ep-dropdown-open .ep-dropdown-menu{
    display:block;
  }

  .ep-dropdown-menu a{
    display:block;
    width:100%;
    padding:12px 14px 12px 30px;
    border-radius:8px;
  }

  /*
     Disable the desktop hover dropdown on touch/mobile.
     This prevents the submenu from appearing unexpectedly.
  */
  .ep-dropdown:hover .ep-dropdown-menu{
    display:none;
  }

  .ep-dropdown.ep-dropdown-open:hover .ep-dropdown-menu{
    display:block;
  }
}


/* ---------- REDUCED MOTION ---------- */

@media(prefers-reduced-motion:reduce){

  .ep-site-header *{
    transition:none!important;
  }
}
/* =========================================================
   EMPLOYMENT PLAN CAROUSEL
   Four-slide, accessible, responsive, touch-enabled carousel.
   Put this HTML file in the same folder as the four images.
   ========================================================= */

.ep-carousel {
  --navy: #09275b;
  --blue: #1d5fc7;
  --gold: #f2ad24;
  --cream: #fbf5ec;
  --ink: #17243a;
  --muted: #617086;
  --white: #ffffff;

  width: 100%;
  padding: 28px 18px;
  box-sizing: border-box;
  font-family: Arial, Helvetica, sans-serif;
}

.ep-carousel *,
.ep-carousel *::before,
.ep-carousel *::after {
  box-sizing: border-box;
}

.ep-carousel__shell {
  position: relative;
  max-width: 1320px;
  margin: 0 auto;
}

.ep-carousel__viewport {
  position: relative;
  overflow: hidden;
  border-radius: 28px;
  background: var(--cream);
  box-shadow:
    0 24px 65px rgba(9, 39, 91, .14),
    0 5px 18px rgba(9, 39, 91, .08);
  touch-action: pan-y;
  outline: none;
}

.ep-carousel__viewport:focus-visible {
  box-shadow:
    0 0 0 4px rgba(29,95,199,.25),
    0 24px 65px rgba(9,39,91,.14);
}

.ep-carousel__track {
  display: flex;
  width: 100%;
  transition: transform 720ms cubic-bezier(.22,.61,.36,1);
  will-change: transform;
}

.ep-slide {
  flex: 0 0 100%;
  min-width: 100%;
  min-height: 620px;
  display: grid;
  grid-template-columns: 43% 57%;
  position: relative;
  overflow: hidden;
  background: var(--cream);
}

/* ---------- TEXT ---------- */

.ep-slide__content {
  position: relative;
  z-index: 4;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 64px 30px 90px 72px;
}

.ep-eyebrow {
  margin-bottom: 18px;
  color: var(--blue);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 2.4px;
  text-transform: uppercase;
}

.ep-slide h1,
.ep-slide h2 {
  margin: 0;
  color: var(--navy);
  font-size: clamp(42px, 4.3vw, 66px);
  line-height: 1.02;
  letter-spacing: -2.5px;
  font-weight: 800;
}

.ep-slide h2 {
  font-size: clamp(40px, 3.9vw, 60px);
}

.ep-slide h1 span,
.ep-slide h2 span {
  display: block;
  color: var(--blue);
}

.ep-rule {
  width: 88px;
  height: 6px;
  margin: 22px 0 24px;
  border-radius: 20px;
  background: var(--gold);
}

.ep-slide p {
  max-width: 525px;
  margin: 0 0 28px;
  color: var(--muted);
  font-size: 18px;
  line-height: 1.65;
}

.ep-button {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  align-self: flex-start;
  padding: 14px 21px;
  border-radius: 9px;
  background: var(--blue);
  color: white;
  text-decoration: none;
  font-size: 15px;
  font-weight: 800;
  box-shadow: 0 9px 22px rgba(29,95,199,.22);
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.ep-button:hover {
  background: var(--navy);
  transform: translateY(-2px);
  box-shadow: 0 13px 28px rgba(9,39,91,.22);
}

.ep-button:focus-visible {
  outline: 3px solid rgba(29,95,199,.35);
  outline-offset: 4px;
}

/* ---------- IMAGE AREA ---------- */

.ep-slide__visual {
  position: relative;
  min-height: 620px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 34px 45px 34px 10px;
  background:
    radial-gradient(circle at 55% 50%, rgba(255,255,255,.85), rgba(251,245,236,.15) 58%),
    var(--cream);
}

.ep-slide__visual::before {
  content: "";
  position: absolute;
  width: 76%;
  height: 78%;
  right: 3%;
  top: 11%;
  border-radius: 42% 58% 48% 52% / 48% 44% 56% 52%;
  background: rgba(255,255,255,.34);
  filter: blur(1px);
}

.ep-slide__image {
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  max-width: 780px;
  height: auto;
  max-height: 555px;
  object-fit: contain;
  border-radius: 16px;
  box-shadow: 0 18px 42px rgba(9,39,91,.10);
  animation: epImageIn .8s both;
}

@keyframes epImageIn {
  from { opacity: 0; transform: scale(.965) translateX(16px); }
  to   { opacity: 1; transform: scale(1) translateX(0); }
}

/* ---------- SLIDE-SPECIFIC ACCENTS ---------- */

.ep-slide--resume .ep-slide__content::after,
.ep-slide--interview .ep-slide__content::after,
.ep-slide--network .ep-slide__content::after,
.ep-slide--book .ep-slide__content::after {
  content: "";
  position: absolute;
  left: 22px;
  top: 12%;
  bottom: 14%;
  width: 1px;
  background: rgba(9,39,91,.08);
}

.ep-slide--book .ep-slide__visual {
  background:
    radial-gradient(circle at 50% 45%, #fffdf8 0%, #f8ead9 58%, #f1ddc6 100%);
}

.ep-book-image {
  max-height: 510px;
  width: auto;
  max-width: 74%;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 25px 55px rgba(35,25,15,.20);
}

.ep-book-badge {
  position: absolute;
  z-index: 5;
  right: 8%;
  bottom: 15%;
  padding: 13px 17px;
  border-radius: 10px;
  background: white;
  color: var(--navy);
  box-shadow: 0 12px 28px rgba(9,39,91,.14);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .8px;
  animation: epFloat 4s ease-in-out infinite;
}

@keyframes epFloat {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-9px); }
}

/* ---------- CONTROLS ---------- */

.ep-carousel__controls {
  position: absolute;
  z-index: 20;
  left: 72px;
  bottom: 24px;
  display: flex;
  align-items: center;
  gap: 13px;
}

.ep-arrow {
  width: 43px;
  height: 43px;
  border: 1px solid rgba(9,39,91,.12);
  border-radius: 50%;
  background: rgba(255,255,255,.94);
  color: var(--navy);
  cursor: pointer;
  font-size: 19px;
  box-shadow: 0 4px 14px rgba(9,39,91,.08);
  transition: transform .18s ease, background .18s ease;
}

.ep-arrow:hover {
  background: white;
  transform: translateY(-2px);
}

.ep-arrow:focus-visible,
.ep-dot:focus-visible {
  outline: 3px solid rgba(29,95,199,.35);
  outline-offset: 3px;
}

.ep-dots {
  display: flex;
  align-items: center;
  gap: 7px;
}

.ep-dot {
  width: 9px;
  height: 9px;
  padding: 0;
  border: 0;
  border-radius: 20px;
  background: #c6cdd6;
  cursor: pointer;
  transition: width .25s ease, background .25s ease;
}

.ep-dot[aria-selected="true"] {
  width: 30px;
  background: var(--blue);
}

/* ---------- PROGRESS BAR ---------- */

.ep-progress {
  position: absolute;
  z-index: 30;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 4px;
  background: rgba(9,39,91,.07);
}

.ep-progress__bar {
  width: 0%;
  height: 100%;
  background: var(--gold);
}

/* ---------- SCREEN READER ---------- */

.ep-status {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
}

/* ---------- TABLET ---------- */

@media (max-width: 950px) {
  .ep-slide {
    grid-template-columns: 1fr;
  }

  .ep-slide__content {
    min-height: 405px;
    padding: 52px 55px 86px;
  }

  .ep-slide__visual {
    min-height: 430px;
    padding: 10px 35px 35px;
  }

  .ep-slide__image {
    max-height: 395px;
  }

  .ep-book-image {
    max-height: 370px;
  }

  .ep-carousel__controls {
    left: 55px;
  }
}

/* ---------- MOBILE ---------- */

@media (max-width: 600px) {
  .ep-carousel {
    padding: 10px 8px;
  }

  .ep-carousel__viewport {
    border-radius: 20px;
  }

  .ep-slide__content {
    min-height: 445px;
    padding: 42px 28px 85px;
  }

  .ep-slide__content::after {
    display: none;
  }

  .ep-slide h1,
  .ep-slide h2 {
    font-size: 39px;
    letter-spacing: -1.5px;
  }

  .ep-slide p {
    font-size: 16px;
    line-height: 1.55;
  }

  .ep-slide__visual {
    min-height: 300px;
    padding: 5px 12px 28px;
  }

  .ep-slide__image {
    max-height: 285px;
    border-radius: 10px;
  }

  .ep-book-image {
    max-width: 68%;
    max-height: 285px;
  }

  .ep-book-badge {
    right: 7%;
    bottom: 12%;
    font-size: 10px;
  }

  .ep-carousel__controls {
    left: 28px;
    bottom: 21px;
  }
}

/* ---------- REDUCED MOTION ---------- */

@media (prefers-reduced-motion: reduce) {
  .ep-carousel__track,
  .ep-slide__image,
  .ep-button,
  .ep-arrow,
  .ep-dot {
    transition: none !important;
  }

  .ep-slide__image,
  .ep-book-badge {
    animation: none !important;
  }
}