:root {
      --navy: #1B3A5C;
      --teal: #0D7A8A;
      --teal-light: #e6f4f6;
      --mid-gray: #666666;
      --light-gray: #f7f7f6;
      --dark: #1A1A1A;
      --rule: #0D7A8A;
      --page-width: 90%;
    }

    * {
      box-sizing: border-box;
      margin: 0;
      padding: 0;
    }

    body {
      background: #ffffff;
      color: var(--dark);

    }

    #resume-container {
      max-width: var(--page-width);
      margin: 20px auto 20px auto;
      min-height:%20fit-content;
      background: #ffffff;
      box-shadow: 0 4px 40px rgba(27,58,92,0.13);
      padding: 56px 64px 56px 64px;
      overflow: auto;
    }

    /* ---- HEADER ---- */
    .resume-header {

      padding-bottom: 20px;
      margin-bottom: 28px;
    }

    .resume-name {
      font-family: 'Raleway', 'Arial', sans-serif;
      font-size: 3rem;
      color: var(--navy);
      letter-spacing: -0.5px;
      line-height: 1;
      margin-bottom: 6px;
    }

    .resume-tagline {
      font-family: 'Raleway', 'Arial', sans-serif;
      font-size: 1.4rem;
      color: var(--teal);
      font-style: italic;
      font-weight: 300;
      letter-spacing: 0.3px;
      margin-bottom: 12px;
    }

    .resume-contact {
      font-size: 1rem;
      color: var(--mid-gray);
      display: flex;
      flex-wrap: wrap;
      gap: 6px 0;
      align-items: center;
    }

    .resume-contact span {
      padding: 0 10px;
      border-right: 1px solid #ccc;
    }

    .resume-contact span:first-child {
      padding-left: 0;
    }

    .resume-contact span:last-child {
      border-right: none;
    }

    .resume-contact a {
      color: var(--teal);
      text-decoration: none;
    }

    .resume-contact a:hover {
      text-decoration: underline;
    }

    /* ---- SECTIONS ---- */
    .resume-section {
      margin-bottom: 24px;
    }

    .section-label {
      font-family: 'Arial', sans-serif;
      font-size: 1.2rem;
      font-weight: 600;
      letter-spacing: 2.2px;
      text-transform: uppercase;
      color: var(--navy);
      border-bottom: 2.5px solid var(--teal);
      padding-bottom: 5px;
      margin-bottom: 14px;
    }

    /* ---- PROFILE ---- */
    .profile-text {
      font-size: 1.2rem;
      line-height: 1.7;
      color: var(--dark);
      font-weight: 300;
    }

    /* ---- SKILLS ---- */
    .skills-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 6px 32px;
    }

    .skill-row {
      font-size: 1rem;
      line-height: 1.5;
      color: var(--dark);
    }

    .skill-label {
      font-weight: 600;
      color: var(--navy);
    }

    /* ---- JOBS ---- */
    .job {
      margin-bottom: 18px;
    }

    .job-header {
      display: flex;
      align-items: baseline;
      flex-wrap: wrap;
      gap: 0 6px;
      margin-bottom: 7px;
    }

    .job-title {
      font-family: 'DM Serif Display', serif;
      font-size: 1.2rem;
      color: var(--dark);
      font-weight: 400;
    }

    .job-sep {
      color: #bbb;
      font-size: 0.8rem;
    }

    .job-company {
      font-size: 1rem;
      font-weight: 600;
      color: var(--teal);
    }

    .job-meta {
      font-size: 1rem;
      color: var(--mid-gray);
      font-style: italic;
      margin-left: auto;
      white-space: nowrap;
    }

    .job-bullets {
      list-style: none;
      padding: 0;
      margin: 0;
    }

    .job-bullets li {
      font-size: 1rem;
      line-height: 1.6;
      color: var(--dark);
      font-weight: 300;
      padding-left: 16px;
      position: relative;
      margin-bottom: 4px;
    }

    .job-bullets li::before {
      content: '-';
      position: absolute;
      left: 0;
      color: var(--teal);
      font-weight: 600;
    }

    /* ---- EDUCATION ---- */
    .edu-row {
      font-size: 1rem;
      line-height: 1.6;
      color: var(--dark);
    }

    .edu-row strong {
      color: var(--navy);
    }

    /* ---- AWARDS ---- */
    .awards-text {
      font-size: 1rem;
      color: var(--mid-gray);
      line-height: 1.8;
    }

    .awards-text span {
      display: inline;
    }

    .award-dot {
      color: var(--teal);
      padding: 0 5px;
    }
    
    @media print {
  body {
    background: none;
    padding: 0;
    margin: 0;
    height: auto; 
    overflow: visible;
  }

  #resume-container {
    box-shadow: none;
    max-width: 100%;
    padding: 0;
    margin: 0;
  }
  .job {
    page-break-inside: avoid;
  }
  @page {
    size: letter portrait;
    margin: 0.75in;
  }

}