/* ─── DESIGN TOKENS ─── */
    :root {
      --navy: #1d3340;
      --navy-dk: #162837;
      --navy-md: #243f50;
      --amber: #dc994d;
      --white: #ffffff;
      --off: #f8f7f5;
      --ink: #1a2630;
      --muted: #6b7f8a;
      --line: rgba(29, 51, 64, .1);
      --line-w: rgba(255, 255, 255, .1);
    }

    /* ─── BASE ─── */
    *,
    *::before,
    *::after {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    body {
      font-family: 'Jost', sans-serif;
      background: var(--white);
      color: var(--ink);
    }

    .ds {
      font-family: 'DM Serif Display', serif;
    }

    /* ─── HERO ─── */
    .hero-bg {
      min-height: 68vh;
    }

    @media(max-width:767px) {
      .hero-bg {
        min-height: 52vh;
      }
    }

    .hero-photo {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: fill;
      object-position: center;
      display: block;
      z-index: 0;
    }

    .hero-scrim {
      background: linear-gradient(120deg, rgba(22, 40, 55, .96) 38%, rgba(22, 40, 55, .55) 100%);
      z-index: 1;
    }

    /* ─── FADE-UP ENTRANCE ─── */
    @keyframes up {
      from {
        opacity: 0;
        transform: translateY(18px);
      }

      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .u1 {
      animation: up .65s .08s both;
    }

    .u2 {
      animation: up .65s .22s both;
    }

    .u3 {
      animation: up .65s .36s both;
    }

    .u4 {
      animation: up .65s .50s both;
    }

    /* ─── SCROLL BOUNCE ─── */
    @keyframes bob {

      0%,
      100% {
        transform: translateY(0)
      }

      50% {
        transform: translateY(6px)
      }
    }

    .bob {
      animation: bob 2s ease infinite;
    }

    /* ─── SECTION DIVIDER LINE ─── */
    .sect-line {
      width: 40px;
      height: 2px;
      background: var(--amber);
    }

    /* ─── PILL BADGE ─── */
    .pill {
      display: inline-block;
      font-size: .62rem;
      font-weight: 500;
      letter-spacing: .12em;
      text-transform: uppercase;
      padding: 4px 12px;
      border: 1px solid var(--amber);
      color: var(--amber);
    }

    /* ─── BUTTONS ─── */
    .btn-amber {
      background: var(--amber);
      color: #fff;
      border: none;
      border-radius: 0;
      font-family: 'Jost', sans-serif;
      font-size: .75rem;
      font-weight: 500;
      letter-spacing: .14em;
      text-transform: uppercase;
      padding: 14px 32px;
      transition: filter .2s, transform .2s;
      white-space: nowrap;
    }

    .btn-amber:hover {
      filter: brightness(1.1);
      transform: translateY(-1px);
      color: #fff;
    }

    .btn-outline-navy {
      background: transparent;
      color: var(--navy);
      border: 1.5px solid var(--navy);
      border-radius: 0;
      font-family: 'Jost', sans-serif;
      font-size: .75rem;
      font-weight: 500;
      letter-spacing: .14em;
      text-transform: uppercase;
      padding: 13px 32px;
      transition: background .2s, color .2s;
      white-space: nowrap;
    }

    .btn-outline-navy:hover {
      background: var(--navy);
      color: #fff;
    }

    .btn-outline-white {
      background: transparent;
      color: #fff;
      border: 1.5px solid rgba(255, 255, 255, .35);
      border-radius: 0;
      font-family: 'Jost', sans-serif;
      font-size: .75rem;
      font-weight: 400;
      letter-spacing: .14em;
      text-transform: uppercase;
      padding: 13px 32px;
      transition: border-color .2s, color .2s;
      white-space: nowrap;
    }

    .btn-outline-white:hover {
      border-color: #fff;
      color: #fff;
    }

    /* ─── NAV LINK UNDERLINE ─── */
    .nav-ul {
      position: relative;
      text-decoration: none;
      font-size: .72rem;
      font-weight: 500;
      letter-spacing: .12em;
      text-transform: uppercase;
      padding: 6px 0;
      display: inline-block;
    }

    .nav-ul::after {
      content: '';
      position: absolute;
      bottom: 0;
      left: 0;
      right: 100%;
      height: 1px;
      background: var(--amber);
      transition: right .3s ease;
    }

    .nav-ul:hover::after,
    .nav-ul.active::after {
      right: 0;
    }

    /* ─── VIDEO FRAME ─── */
    .vframe {
      position: relative;
    }

    .vframe::after {
      content: '';
      position: absolute;
      bottom: -10px;
      right: -10px;
      width: 70%;
      height: 70%;
      border: 1px solid var(--amber);
      pointer-events: none;
      z-index: 0;
    }

    .vframe video {
      position: relative;
      z-index: 1;
    }

    /* ─── JOB ROW ─── */
    .jrow {
      display: flex;
      align-items: center;
      gap: 16px;
      padding: 20px 0;
      border-bottom: 1px solid var(--line);
      cursor: pointer;
      transition: padding-left .2s;
      text-decoration: none;
      color: inherit;
    }

    .jrow:hover {
      padding-left: 8px;
    }

    .jrow:hover .jrow-arrow {
      color: var(--amber);
      transform: translateX(4px);
    }

    .jrow-arrow {
      transition: transform .2s, color .2s;
      color: var(--muted);
    }

    /* ─── TCARD ─── */
    .tcard {
      border: 1px solid var(--line);
      padding: 32px;
      height: 100%;
      display: flex;
      flex-direction: column;
      transition: border-color .25s, box-shadow .25s;
    }

    .tcard:hover {
      border-color: var(--amber);
      box-shadow: 0 8px 32px rgba(29, 51, 64, .08);
    }

    /* ─── PILLAR ─── */
    .pillar {
      border-top: 2px solid var(--line);
      padding: 28px 0 0;
      transition: border-top-color .25s;
    }

    .pillar:hover {
      border-top-color: var(--amber);
    }

    /* ─── ACT CARD ─── */
    .acard {
      border: 1px solid var(--line-w);
      overflow: hidden;
      transition: transform .25s, border-color .25s;
    }

    .acard:hover {
      transform: translateY(-4px);
      border-color: rgba(220, 153, 77, .4);
    }

    .acard-img {
      width: 100%;
      height: 200px;
      object-fit: cover;
      display: block;
    }

    @media(min-width:768px) {
      .acard-img {
        height: 220px;
      }
    }

    /* ─── STAT NUMBER ─── */
    .stat-num {
      font-family: 'DM Serif Display', serif;
      font-size: clamp(3rem, 6vw, 5rem);
      color: var(--navy);
      line-height: 1;
    }

    /* ─── VIDEO SLIDER ─── */
    .vslide {
      display: none;
    }

    /* ─── RESPONSIVE: stacked buttons ─── */
    @media(max-width:575px) {
      .hero-btns {
        flex-direction: column;
      }

      .hero-btns a {
        width: 100%;
        text-align: center;
        justify-content: center;
      }
    }

    @media (min-width: 992px) {
      .dropdown:hover>.dropdown-menu {
        display: block;
        margin-top: 0;
      }

      /* Mejora visual al pasar el cursor sobre los items */
      .dropdown-item:hover {
        background-color: rgba(255, 255, 255, 0.1) !important;
        color: var(--amber) !important;
      }
    }