body { margin: 0; font-family: "Segoe UI", "Helvetica", "Arial", sans-serif; color: #ffffff; min-height: 100vh; background: linear-gradient( to right, #000408 0%, #001939 20%, #001939 80%, #000408 100% );}

.site-header { display: flex; justify-content: center; align-items: center; padding: 15px 20px; position: relative; }
.site-title { font-family: "Georgia", "Times New Roman", serif; text-transform: uppercase; color: #7d859e; text-decoration: none; flex: 1; text-align: center; transition: color 0.3s ease, font-weight 0.3s ease; }
.site-title .big { font-size: 32px; font-weight: normal; }
.site-title .small { font-size: 24px; font-weight: normal; }
.site-title:hover { color: #ffffff; font-weight: 600; }
.header-icons { position: absolute; right: 20px; display: flex; gap: 10px; transition: 1.0s ease; }
.icon-img { width: 40px; height: 40px; cursor: pointer; transition: 1.0s ease; }

.navbar { margin-top: 0px; padding: 10px 10px; /*border-bottom: 2px solid #333;*/ }
.navbar ul { list-style: none; padding: 0; margin: 0; display: flex; justify-content: center; flex-wrap: wrap; gap: 5px; row-gap: 24px; }
.navbar a { text-decoration: none; color: rgba(255, 255, 255, 0.67); font-size: 18px; padding: 10px 16px; /*border-radius: 3px;*/ transition: 0.3s ease; }
.navbar a:hover { color: white; background: #007bff; }
.navbar a.active { color: white; background: #007bff; }

.content_heading2 { color: #fff; font-family: "Segoe UI", "Helvetica", "Arial", sans-serif; font-size: 15px; width: 90%; padding-top: 10px; padding-bottom: 0px; margin: 0px auto; display:block; }

/* Default: large screens */ 
.content-wrapper {width: 80%; margin: 0 auto;}
/* Between 1200px and 1100px */
@media (max-width: 1130px)
{.content-wrapper {width: 90%;}}
/* 950px and below */
@media (max-width: 950px) 
{.content-wrapper {width: 100%;}}

/* Responsive: left-align name on narrow screens */
@media (max-width: 600px) {
  .site-header {justify-content: flex-start;}
  .site-title {text-align: left;}}

.thumbframe { width: 190px; height: 120px;}
.thumb { width: 160px; height: 90px;}

.video-modal { display: none; position: fixed; z-index: 9999; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.85); justify-content: center; align-items: center; }
.video-content { width: 80%; max-width: 900px; }
.video-content iframe { width: 100%; height: 500px; border: none; }

#prefooter { text-align: center; width: 800px; height: 25px; }
#footer{ bottom: 0; text-align: center; width: 790px; height: auto; padding-top: 9px; padding-bottom: 12px; margin: -15px auto 0px auto; display: block; }
.footfont { font-weight: 400; color: #737a80; font-family: "Segoe UI", "Helvetica", "Arial", sans-serif; font-size: small; }
#footer2 { background-color: #000408; /*was#01192b*/ bottom: 0; left: 0px; position:fixed; right: 0px; text-align: center; width: 100%; height: auto; padding-top: 9px; padding-bottom: 12px; margin: -15px auto 0px auto; display: block; }

/* == INDEX COMPANY NAMES ==*/
.list-wrapper { width: 80%; max-width: 1180px; margin: 0 auto; /* centers the section */ }
.grid-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem 2rem; padding-top: -20px; list-style: "♦ "; padding-left: 1rem; /* keeps bullets aligned */ color: silver; }
@media (min-width: 0px) {
  .grid-list { grid-template-columns: repeat(1, 1fr); }
  .list-wrapper { width: 60%; margin: 0 auto; } }
@media (min-width: 520px) {
  .grid-list { grid-template-columns: repeat(2, 1fr); }
  .list-wrapper { width: 80%; margin: 0 auto; } }
@media (min-width: 800px) {
  .grid-list { grid-template-columns: repeat(3, 1fr); }
  .list-wrapper { width: 80%; margin: 0 auto; /* centers the section */ } }
@media (min-width: 1100px) {
  .grid-list { grid-template-columns: repeat(4, 1fr); }
  .list-wrapper { width: 80%; margin: 0 auto;/* centers the section */ } }

.content-wrap { width: 80%; max-width: 1200px; margin: 0 auto; padding: 1.5rem 1rem; }
.content-wrap h2 { text-align: left; margin: 1.5rem 0 0.5rem; font-size: 1.4rem; letter-spacing: 0.08em; }
.content-wrap p { font-size: 1rem; line-height: 1.6; margin: 0 0 1rem; }
@media (max-width: 700px) { .content-wrap { width: 100%; } }

/* Center only the Skills Summary paragraph */
.skills { text-align: center; font-size: 1rem; }
@media (max-width: 550px) { .skills { font-size: 0.9rem; } }
@media (max-width: 420px) { .skills { font-size: 0.8rem; } }

.resume-wrap { width: 80%; max-width: 1200px; margin: 0 auto; padding: 0rem; }
.resume-wrap h2 + p { margin-left: 30px; }

h2 { margin-top: 2rem; margin-bottom: .5rem; text-align: left; letter-spacing: .05em; color: rgb(230, 230, 230); }

/* INDEX ONLY */
.intro { line-height: 1.6; margin-bottom: 2rem; color: silver; }
.skills { text-align: center; line-height: 1.6; margin-bottom: 2rem; }

.subhead { margin-top: 2.5rem; margin-bottom: 1.5rem; text-align: left; max-width: 88%; margin-left: auto; margin-right: auto; color: silver; margin-left: 0px; }

.client-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1.5rem; margin-bottom: 2rem; }

.software-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); column-gap: 1rem; row-gap: 0.3rem; margin-bottom: -0.8rem; line-height: 1.6; font-size: 1rem; color: silver; margin-left: 30px; letter-spacing: 0.4px; }
/* Slightly smaller text on medium screens */
@media (max-width: 850px) { .software-grid { font-size: 0.9rem; letter-spacing: -0.1px; } }
/* Even smaller text on narrow screens */
@media (max-width: 730px) { .software-grid { font-size: 0.8rem; } }

.software-line-tight { margin-bottom: 0.25rem; /* smaller bottom space */ color: silver; }

.accomplishments { line-height: 1.7; margin-bottom: 2rem; color: silver; }

/* Mobile adjustments */
@media (max-width: 700px) {
  .resume-wrap { width: 90%; }
  .skills { font-size: .9rem; } }

@media (max-width: 450px) { .skills { font-size: .8rem; } }

/* === INDEX - JOB SKILLS ===*/
.skills-inline { display: flex; flex-wrap: wrap; gap: 8px 0px; line-height: 1.5; justify-content: center; margin-bottom: 2rem; color: silver; }
.skills-inline div { position: relative; padding-right: 20px; text-align: left; white-space: nowrap; }
.skills-inline div::after { content: ""; position: absolute; right: 8px; top: 0; bottom: 0; width: 1px; background: rgba(255, 255, 255, 0.5); }
/* Remove line from last item */
.skills-inline div:last-child::after { display: none; }
/* Slight font scaling on very small screens */
@media (max-width: 450px) { .skills-inline div { font-size: 0.9rem; } }

.semibold { font-weight: 500; /* 400=normal, 700=bold */ }

.recommendations { max-width: 80%; margin: 0 auto 2rem auto; color: silver; font-family: "Segoe UI", "Helvetica", "Arial", sans-serif; }
.rec { margin-bottom: 2.5rem; }
.quote { font-style: italic; font-size: 1rem; line-height: 1.6; margin-bottom: 0.5rem; text-align: left; }
.name { font-size: 1rem; margin-left: 2rem; line-height: 1.4; }
.name a { color: silver; text-decoration: underline; }
.linkedin-cta { text-align: center; margin: 2rem 0; }
.linkedin-button { display: inline-block; padding: 10px 20px; color: white; text-decoration: none; border-radius: 0px; font-size: 1rem; opacity: 0.5; /*background: #0a66c2;*/ }
.linkedin-button:hover { background: #007bff; /*#004182;*/ color: white;   opacity: 1; }

/* Mobile adjustments */
@media (max-width: 600px) {
  .recommendations { max-width: 100%; }
  .name { margin-left: 0; }
  .quote { font-size: 0.95rem; } }