@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600,700,800);
    @charset "utf-8";

    @-webkit-viewport {
      width: device-width;
    }

    @-moz-viewport {
      width: device-width;
    }

    @-ms-viewport {
      width: device-width;
    }

    @-o-viewport {
      width: device-width;
    }

    @viewport {
      width: device-width;
    }

    body {
      font-family: 'Open Sans', Arial, Tahoma;
      font-weight: 400;
      color: #363636;
      background: #334960;
      z-index: 10;
    }

    blockquote {
      font-size: 1em;
    }

    .container {
      margin-top: 80px;
      margin-bottom: 15px;
      background: #fff;
      z-index: 11;
    }

    .row {
      z-index: 11;
      background: #fff;
    }

    #photo-header {
      margin-top: -75px;
    }

    #photo {
      width: 160px;
      height: 160px;
      border-radius: 50%;
      overflow: hidden;
      padding: 5px;
      background: #334960;
      display: inline-block;
    }

    #photo img {
      width: 150px;
      height: 150px;
      border-radius: 50%;
    }

    #text-header h1 {
      margin: 0;
      padding: 0;
      font-size: 1.5em;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: -1px;
    }

    #text-header h1::first-line {
      font-size: 1.5em;
      font-weight: 800;
      line-height: 1.5em;
    }

    #text-header h1 span {
      color: #334960;
      opacity: 0.7;
    }

    #text-header h1 sup {
      opacity: 0.5;
    }

    #text-header:after {
      width: 100%;
      height: 3px;
      border-bottom: 1px solid #ddd;
      margin-top: 15px;
      content: '';
      display: block;
    }

    .box {
      padding-bottom: 10px;
      margin-bottom: 25px;
    }

    .box h2 {
      color: #227c74;
      font-size: 1.5em;
      font-weight: 700;
      text-transform: uppercase;
    }

    /* Collapsible CV sections (<details>) — panel + chevron */
    details.cv-section {
      padding-bottom: 10px;
      margin-bottom: 25px;
    }

    details.cv-section>summary {
      list-style: none;
      display: flex;
      align-items: center;
      flex-wrap: nowrap;
      gap: 0.35em;
      cursor: pointer;
      color: #227c74;
      font-size: 1.5em;
      font-weight: 700;
      text-transform: uppercase;
      padding: 4px 0 12px;
      margin: 0;
      border-bottom: 2px solid #e8eceb;
      user-select: none;
    }

    details.cv-section>summary::-webkit-details-marker {
      display: none;
    }

    details.cv-section>summary::after {
      content: '\f078';
      font-family: 'Font Awesome 5 Free';
      font-weight: 900;
      margin-left: auto;
      font-size: 0.45em;
      opacity: 0.55;
      transition: transform 0.2s ease;
    }

    details.cv-section[open]>summary::after {
      transform: rotate(-180deg);
    }

    .cv-section-body {
      padding-top: 6px;
    }

    .section-intro {
      margin: 6px 0 14px;
      color: #4d5a59;
      font-size: 0.96em;
      line-height: 1.55;
    }

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

    details.project-group {
      margin-top: 14px;
      border: 1px solid #dde7e5;
      border-radius: 6px;
      background: #fcfdfd;
      overflow: hidden;
    }

    details.project-group:first-of-type {
      margin-top: 0;
    }

    details.project-group > summary.project-group-title {
      list-style: none;
      cursor: pointer;
      margin: 0;
      padding: 11px 14px;
      color: #1f4742;
      font-size: 1.02em;
      font-weight: 700;
      user-select: none;
      background: #f7fbfa;
      border-bottom: 1px solid transparent;
    }

    details.project-group > summary.project-group-title::-webkit-details-marker {
      display: none;
    }

    details.project-group > summary.project-group-title::after {
      content: '\f078';
      font-family: 'Font Awesome 5 Free';
      font-weight: 900;
      float: right;
      font-size: 0.78em;
      color: #227c74;
      opacity: 0.7;
      transition: transform 0.2s ease;
    }

    details.project-group[open] > summary.project-group-title {
      border-bottom-color: #dde7e5;
      background: #f4faf9;
    }

    details.project-group[open] > summary.project-group-title::after {
      transform: rotate(-180deg);
      display: inline-block;
    }

    .project-group-body {
      padding: 12px 14px 4px;
    }

    .project-group-intro {
      margin: 0 0 10px;
      color: #5d6a69;
      font-size: 0.92em;
      line-height: 1.5;
    }

    details.project-subgroup {
      margin-top: 14px;
      border-top: 1px solid #e5ecea;
      padding-top: 10px;
    }

    details.project-subgroup:first-of-type {
      margin-top: 0;
      border-top: none;
      padding-top: 0;
    }

    details.project-subgroup > summary.project-subgroup-title {
      list-style: none;
      cursor: pointer;
      margin: 0;
      color: #1f4742;
      font-size: 0.98em;
      font-weight: 700;
      user-select: none;
    }

    details.project-subgroup > summary.project-subgroup-title::-webkit-details-marker {
      display: none;
    }

    details.project-subgroup > summary.project-subgroup-title::after {
      content: '\f078';
      font-family: 'Font Awesome 5 Free';
      font-weight: 900;
      float: right;
      font-size: 0.74em;
      color: #227c74;
      opacity: 0.7;
      transition: transform 0.2s ease;
    }

    details.project-subgroup[open] > summary.project-subgroup-title::after {
      transform: rotate(-180deg);
      display: inline-block;
    }

    .project-subgroup-body {
      padding-top: 8px;
    }

    .project-subgroup-intro {
      margin: 0 0 10px;
      color: #5d6a69;
      font-size: 0.9em;
      line-height: 1.5;
    }

    .project-card {
      border: 1px solid #dde7e5;
      border-left: 4px solid #227c74;
      border-radius: 0 5px 5px 0;
      background: #fbfdfd;
      margin-bottom: 10px;
      padding: 9px 11px;
    }

    .project-title {
      font-size: 1.03em;
      font-weight: 700;
      color: #1f4742;
    }

    .project-context {
      font-size: 0.9em;
      color: #5d6a69;
      margin-top: 2px;
    }

    .project-impact {
      margin: 5px 0;
      line-height: 1.5;
    }

    .project-tags {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      margin-top: 3px;
    }

    .project-tag {
      background: #32475c;
      color: #fff;
      font-size: 0.75em;
      border-radius: 999px;
      padding: 3px 8px;
    }

    .project-card--uml {
      padding: 11px 13px;
      background: #f4faf9;
    }

    .project-card-header {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
    }

    .project-github-stars {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 0.85em;
      font-weight: 700;
      color: #7a5c10;
      background: #fff8e6;
      border: 1px solid #e8d4a8;
      border-radius: 999px;
      padding: 4px 10px;
      text-decoration: none;
      white-space: nowrap;
    }

    .project-github-stars:hover,
    .project-github-stars:focus {
      background: #fff3d6;
      border-color: #d4b87a;
      color: #5c4508;
    }

    .github-profile-stats {
      display: flex;
      flex-wrap: wrap;
      gap: 10px 14px;
      margin-top: 6px;
      font-size: 0.82em;
      line-height: 1.3;
    }

    .github-profile-stats .github-stat strong {
      font-weight: 700;
    }

    .github-profile-stats .github-stat-contrib strong {
      color: #c9a227;
    }

    .github-profile-stats .github-stat-stars,
    .github-profile-stats .github-stat-forks {
      color: #32475c;
    }

    .project-card-body {
      display: grid;
      grid-template-columns: minmax(11rem, 38%) 1fr;
      gap: 12px;
      margin-top: 8px;
      align-items: center;
    }

    .project-card--uml .project-card-body {
      grid-template-columns: minmax(12rem, 40%) 1fr;
    }

    .project-card-copy {
      min-width: 0;
    }

    .project-diagram {
      margin: 0;
      padding: 8px;
      border: 1px solid #dde7e5;
      border-radius: 6px;
      background: #fff;
    }

    .project-diagram svg {
      width: 100%;
      max-width: 11.5rem;
      height: auto;
      display: block;
      margin: 0 auto;
      overflow: visible;
    }

    .project-card--simility {
      padding: 11px 13px;
    }

    .project-card--simility .project-card-body,
    .project-card--renpho .project-card-body {
      grid-template-columns: minmax(10rem, 42%) 1fr;
      align-items: start;
    }

    .project-gallery {
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-width: 0;
    }

    .project-gallery figure {
      margin: 0;
      border: 1px solid #dde7e5;
      border-radius: 6px;
      overflow: hidden;
      background: #fff;
    }

    .project-gallery img {
      width: 100%;
      height: auto;
      display: block;
    }

    .project-gallery figcaption {
      font-size: 0.72em;
      line-height: 1.35;
      padding: 5px 8px 6px;
      color: #5d6a69;
      background: #f4faf9;
      border-top: 1px solid #e8efed;
    }

    .job-gallery {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr));
      gap: 10px;
      margin: 12px 0 14px;
      min-width: 0;
    }

    .job-gallery figure {
      margin: 0;
      border: 1px solid #dde7e5;
      border-radius: 6px;
      overflow: hidden;
      background: #fff;
    }

    .job-gallery-preview-link {
      display: block;
      position: relative;
      width: 100%;
      padding: 0;
      border: none;
      background: none;
      line-height: 0;
      cursor: zoom-in;
    }

    .job-gallery-preview-link:hover img,
    .job-gallery-preview-link:focus-visible img {
      outline: 2px solid #32475c;
      outline-offset: -2px;
    }

    .job-gallery-preview-link img {
      width: 100%;
      height: auto;
      display: block;
    }

    .job-gallery-preview-hint {
      position: absolute;
      right: 6px;
      bottom: 6px;
      width: 28px;
      height: 28px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 4px;
      background: rgba(0, 0, 0, 0.55);
      color: #fff;
      font-size: 12px;
      pointer-events: none;
    }

    .job-gallery figcaption {
      font-size: 0.72em;
      line-height: 1.35;
      padding: 5px 8px 6px;
      color: #5d6a69;
      background: #f4faf9;
      border-top: 1px solid #e8efed;
    }

    .job-gallery--single {
      grid-template-columns: minmax(11rem, 18rem);
    }

    details.project-preview,
    details.project-nuget {
      margin: 8px 0 10px;
      border: 1px solid #dde7e5;
      border-radius: 6px;
      background: #fff;
      overflow: hidden;
    }

    details.project-preview > summary.project-preview-summary,
    details.project-nuget > summary.project-nuget-summary {
      list-style: none;
      display: flex;
      align-items: center;
      gap: 8px;
      cursor: pointer;
      padding: 9px 12px;
      color: #1f4742;
      font-size: 0.92em;
      font-weight: 600;
      user-select: none;
      background: #f8fbfb;
      transition: background-color 0.2s ease, border-color 0.2s ease;
    }

    details.project-preview[open] > summary.project-preview-summary,
    details.project-nuget[open] > summary.project-nuget-summary {
      border-bottom: 1px solid #dde7e5;
      background: #f4faf9;
    }

    details.project-preview > summary.project-preview-summary::-webkit-details-marker,
    details.project-nuget > summary.project-nuget-summary::-webkit-details-marker {
      display: none;
    }

    details.project-preview > summary.project-preview-summary::after,
    details.project-nuget > summary.project-nuget-summary::after {
      content: '\f078';
      font-family: 'Font Awesome 5 Free';
      font-weight: 900;
      margin-left: auto;
      font-size: 0.75em;
      color: #227c74;
      opacity: 0.7;
      transition: transform 0.2s ease;
    }

    details.project-preview[open] > summary.project-preview-summary::after,
    details.project-nuget[open] > summary.project-nuget-summary::after {
      transform: rotate(-180deg);
    }

    details.project-nuget .project-nuget-panel {
      padding: 10px 12px 12px;
    }

    .project-nuget-row {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px 8px;
      padding: 7px 0;
      border-bottom: 1px solid #eef3f2;
    }

    .project-nuget-row:last-of-type {
      border-bottom: none;
    }

    .project-nuget-row a.project-nuget-id {
      flex: 1 1 100%;
      font-size: 0.86em;
      font-weight: 600;
      line-height: 1.35;
      word-break: break-word;
    }

    @media (min-width: 520px) {
      .project-nuget-row a.project-nuget-id {
        flex: 1 1 13.5rem;
        max-width: 13.5rem;
      }
    }

    .project-nuget-badges {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px;
    }

    .project-nuget-badges img {
      height: 20px;
      width: auto;
      vertical-align: middle;
    }

    .project-nuget-note {
      margin: 10px 0 0;
      font-size: 0.82em;
      color: #5d6a69;
      line-height: 1.45;
    }

    details.project-preview .project-preview-panel .project-embed {
      margin: 0;
      border: none;
      border-radius: 0;
      overflow: hidden;
    }

    details.project-preview .project-preview-panel .project-diagram {
      margin: 0;
      border: none;
      border-radius: 0;
      padding: 12px 16px 14px;
      background: #fff;
    }

    .project-embed iframe {
      display: block;
      width: 100%;
      height: 280px;
      border: 0;
    }

    .project-embed--youtube iframe {
      height: 315px;
      max-width: 560px;
    }

    .publication-entry .publication-video-preview {
      margin-top: 10px;
      max-width: 560px;
    }

    .project-embed-note {
      margin: 0;
      padding: 8px 12px 10px;
      font-size: 0.82em;
      color: #5d6a69;
      line-height: 1.4;
    }

    .project-lens-list {
      margin: 0;
      padding: 10px 12px 8px;
      list-style: none;
    }

    @media (min-width: 640px) {
      .project-lens-list {
        columns: 2;
        column-gap: 1.5rem;
      }
    }

    .project-lens-list li {
      break-inside: avoid;
      padding: 3px 0;
      font-size: 0.9em;
      line-height: 1.4;
    }

    .project-lens-list a {
      font-weight: 600;
    }

    .project-lens-list-note {
      margin: 0;
      padding: 6px 12px 10px;
      font-size: 0.82em;
      color: #5d6a69;
      line-height: 1.45;
    }

    .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    .contact-cta {
      margin: 0 0 14px;
      padding: 12px 14px;
      border: 1px solid #c8ddd9;
      border-left: 4px solid #227c74;
      border-radius: 6px;
      background: #f4faf9;
    }

    .contact-cta-lead {
      margin: 0 0 10px;
      color: #1f4742;
      font-size: 0.98em;
      line-height: 1.5;
    }

    .contact-cta .btn {
      margin-top: 0;
    }

    .contact-cta .call-cta-btn {
      display: flex;
      width: 100%;
      justify-content: center;
      padding: 9px 12px;
      border-color: #9ebdb8;
      background: #fff;
      font-weight: 600;
    }

    .contact-cta .call-cta-btn:hover,
    .contact-cta .call-cta-btn:focus {
      background: #e5f0ee;
      border-color: #227c74;
      color: #1a5f56;
    }

    .hero-actions {
      margin-top: 8px;
      display: inline-flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 8px;
    }

    .call-cta-btn {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      border-color: #c8d9d6;
      color: #1f4742;
      transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    }

    .call-cta-btn:hover,
    .call-cta-btn:focus {
      background: #eef6f5;
      border-color: #9ebdb8;
      color: #1c3f3b;
    }

    .call-cta-btn:focus {
      outline: 2px solid #9ebdb8;
      outline-offset: 1px;
    }

    .call-cta-icon {
      width: 1.55em;
      height: 1.55em;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 999px;
      background: #e5f0ee;
      color: #227c74;
      flex-shrink: 0;
    }

    .contact-cta .call-cta-btn {
      font-weight: 600;
    }

    .contact-cta-fallback {
      margin-top: 6px;
      font-size: 0.92em;
      color: #4c5e5b;
    }

    .contact-cta-fallback a {
      color: #227c74;
      font-weight: 600;
      text-decoration: none;
    }

    .contact-cta-fallback a:hover,
    .contact-cta-fallback a:focus {
      text-decoration: underline;
    }

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

    .recommendation-card {
      border: 1px solid #dde7e5;
      border-left: 4px solid #32475c;
      border-radius: 0 5px 5px 0;
      background: #fbfdfd;
      margin-bottom: 10px;
      padding: 9px 11px;
    }

    .recommendation-source {
      margin-top: 5px;
      font-size: 0.9em;
      color: #5d6a69;
    }

    .recommendation-quote {
      margin: 0;
      font-style: italic;
      line-height: 1.55;
      color: #374746;
    }

    .recommendation-author {
      margin-top: 7px;
      font-size: 0.9em;
      color: #5d6a69;
    }

    details.cv-course {
      margin: 10px 0 12px 0;
      border: 1px solid #d5dedc;
      border-left: 4px solid #227c74;
      border-radius: 0 4px 4px 0;
      background: #f9fbfa;
    }

    details.cv-course>summary {
      list-style: none;
      cursor: pointer;
      padding: 10px 12px;
      font-weight: 700;
      color: #1d4a45;
      font-size: 0.98em;
      line-height: 1.35;
      user-select: none;
    }

    details.cv-course>summary::-webkit-details-marker {
      display: none;
    }

    details.cv-course>summary::after {
      content: '\f054';
      font-family: 'Font Awesome 5 Free';
      font-weight: 900;
      float: right;
      font-size: 0.65em;
      opacity: 0.45;
      margin-top: 0.35em;
    }

    details.cv-course[open]>summary::after {
      transform: rotate(90deg);
      display: inline-block;
    }

    /* Second-level collapse: each job under Work Experience / Leadership */
    details.cv-job {
      margin-bottom: 15px;
      border: 1px solid #e0e8e6;
      border-radius: 4px;
      background: #fdfefd;
    }

    details.cv-job>summary.cv-job-summary {
      list-style: none;
      cursor: pointer;
      user-select: none;
    }

    details.cv-job>summary.cv-job-summary:focus-visible {
      outline: 2px solid #227c74;
      outline-offset: 2px;
    }

    details.cv-job>summary.cv-job-summary::-webkit-details-marker {
      display: none;
    }

    details.cv-job>summary.cv-job-summary::after {
      content: '\f054';
      font-family: 'Font Awesome 5 Free';
      font-weight: 900;
      float: right;
      font-size: 0.55em;
      color: #227c74;
      opacity: 0.5;
      margin: 0.6em 8px 0 0;
      transition: transform 0.2s ease;
    }

    details.cv-job[open]>summary.cv-job-summary::after {
      transform: rotate(90deg);
      display: inline-block;
    }

    .cv-job-body {
      padding: 0 4px 10px 4px;
      border-top: 1px solid #eef4f2;
    }

    details.cv-job:not([open]) > .cv-job-body {
      display: none;
    }

    .cv-course-body {
      padding: 0 12px 12px 12px;
      font-size: 0.95em;
    }

    .teaching-tech-ol {
      margin: 0 0 0 1.1em;
      padding: 0;
    }

    .teaching-tech-ol li {
      margin-bottom: 0.5em;
    }

    .teaching-term {
      display: inline-block;
      font-weight: 700;
      color: #334960;
      min-width: 8.5em;
    }

    #awards,
    #education {
      margin-top: 20px;
      margin-bottom: 0;
      position: relative;
      padding: 1em 0;
      list-style: none;
      container-type: inline-size;
      container-name: cv-timeline;
    }

    #awards:before,
    #education:before {
      width: 5px;
      height: 100%;
      position: absolute;
      left: 35px;
      top: 0;
      content: ' ';
      display: block;
      background: #32475c;
      background: -moz-linear-gradient(top, #ffffff 0%, #32475c 7%, #32475c 89%, #ffffff 100%);
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(7%, #32475c), color-stop(89%, #32475c), color-stop(100%, #ffffff));
      background: -webkit-linear-gradient(top, #ffffff 0%, #32475c 7%, #32475c 89%, #ffffff 100%);
      background: -o-linear-gradient(top, #ffffff 0%, #32475c 7%, #32475c 89%, #ffffff 100%);
      background: -ms-linear-gradient(top, #ffffff 0%, #32475c 7%, #32475c 89%, #ffffff 100%);
      background: linear-gradient(to bottom, #ffffff 0%, #32475c 7%, #32475c 89%, #ffffff 100%);
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0);
    }

    #awards li,
    #education li {
      width: 100%;
      z-index: 2;
      position: relative;
      display: grid;
      grid-template-columns: minmax(6.5rem, 8.75rem) minmax(0, 1fr);
      gap: 0.5rem;
      align-items: start;
    }

    #awards .year,
    #education .year {
      width: auto;
      max-width: 100%;
      background: #fff;
      padding: 10px;
      font-weight: 700;
      line-height: 1.35;
      white-space: normal;
      overflow-wrap: break-word;
      word-break: normal;
      float: none !important;
    }

    #awards .description,
    #education .description {
      width: auto;
      min-width: 0;
      display: block;
      float: none !important;
      background: #eee;
      margin-bottom: 10px;
      position: relative;
      padding: 10px;
      border-bottom: 1px solid #ccc;
      border-right: 1px solid #ccc;
      overflow-wrap: break-word;
      word-break: normal;
    }

    #awards .description:after,
    #education .description:after {
      content: '';
      position: absolute;
      top: 15px;
      right: 0;
      left: -16px;
      height: 0;
      width: 0;
      border: solid transparent;
      border-right-color: #eee;
      border-width: 8px;
      pointer-events: none;
    }

    #awards .description h3,
    #education .description h3 {
      font-size: 1.2em;
      margin: 0;
      padding: 0;
      font-weight: 700;
      overflow-wrap: break-word;
      word-break: normal;
    }

    #awards .description h3 a,
    #education .description h3 a {
      overflow-wrap: break-word;
      word-break: normal;
    }

    #awards .description p,
    #education .description p {
      margin-top: 5px;
      padding: 0;
      overflow-wrap: break-word;
      word-break: normal;
    }

    @container cv-timeline (max-width: 16rem) {
      #awards li,
      #education li {
        grid-template-columns: 1fr;
        padding-left: 2rem;
        margin-bottom: 0.75rem;
      }

      #awards:before,
      #education:before {
        left: 0.35rem;
      }

      #awards .year,
      #education .year {
        padding: 0.25rem 0.5rem;
      }

      #awards .description:after,
      #education .description:after {
        display: none;
      }
    }

    .job {
      margin-bottom: 15px;
    }

    .job .details {
      margin-left: 3%;
      width: 95%;
      padding: 10px;
      margin-bottom: 10px;
      background: #eee;
      border-bottom: 1px solid #ccc;
      border-right: 1px solid #ccc;
    }

    .job .where {
      font-size: 1.2em;
      font-weight: bold;
    }

    .job .year {
      opacity: 0.7;
    }

    .job .profession {
      font-size: 1.2em;
      font-weight: bold;
    }

    .job .description {
      line-height: 1.5em;
    }

    .job .highlights {
      padding: 5px 0;
      font-weight: bold;
    }

    .job .job-details {
      padding-left: 5%;
      width: 100%;
    }

    .publication {
      margin-bottom: 0;
    }

    .publication .name {
      font-size: 1em;
      font-weight: bold;
    }

    .publication .year {
      opacity: 0.7;
    }

    .publication p {
      margin: 0;
      padding-top: 10px;
    }

    .publication-entry--raytracing {
      overflow: hidden;
    }

    .publication-entry--raytracing .publication-entry-inner {
      display: flex;
      flex-wrap: wrap;
      align-items: flex-start;
      gap: 10px 0;
      min-width: 0;
    }

    .publication-entry--raytracing .publication-entry-text {
      flex: 1 1 100%;
      min-width: 0;
    }

    .publication-entry--raytracing .publication-preview-gallery {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
      flex: 1 1 100%;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    .publication-entry--raytracing .publication-preview-link,
    .job-gallery-preview-link {
      cursor: zoom-in;
    }

    .publication-entry--raytracing .publication-preview-link {
      position: relative;
      min-width: 0;
      width: 100%;
      max-width: 100%;
      padding: 0;
      border: none;
      background: none;
      line-height: 0;
    }

    .publication-entry--raytracing .publication-preview-link:hover .publication-preview,
    .publication-entry--raytracing .publication-preview-link:focus-visible .publication-preview {
      outline: 2px solid #32475c;
      outline-offset: 2px;
    }

    .publication-entry--raytracing .publication-preview {
      display: block;
      width: 100%;
      max-width: 100%;
      height: auto;
      border-radius: 4px;
      border: 1px solid rgba(0, 0, 0, 0.12);
    }

    .publication-preview-hint {
      position: absolute;
      right: 6px;
      bottom: 6px;
      width: 28px;
      height: 28px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 4px;
      background: rgba(0, 0, 0, 0.55);
      color: #fff;
      font-size: 12px;
      pointer-events: none;
    }

    .publication-preview-dialog {
      border: none;
      padding: 0;
      width: min(96vw, 1200px);
      max-width: 96vw;
      background: transparent;
      color: #eee;
    }

    .publication-preview-dialog::backdrop {
      background: rgba(0, 0, 0, 0.85);
      cursor: zoom-out;
    }

    .publication-preview-dialog-panel {
      position: relative;
      margin: 0;
      padding: 12px 12px 14px;
      border-radius: 8px;
      background: #1a1f26;
      box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
    }

    .publication-preview-dialog-close {
      position: absolute;
      top: 8px;
      right: 8px;
      z-index: 2;
      width: 36px;
      height: 36px;
      padding: 0;
      border: none;
      border-radius: 4px;
      background: rgba(255, 255, 255, 0.12);
      color: #fff;
      font-size: 1.5rem;
      line-height: 1;
      cursor: pointer;
    }

    .publication-preview-dialog-close:hover,
    .publication-preview-dialog-close:focus-visible {
      background: rgba(255, 255, 255, 0.22);
      outline: 2px solid #fff;
      outline-offset: 1px;
    }

    .publication-preview-dialog-img {
      display: block;
      width: 100%;
      height: auto;
      max-height: min(85vh, 900px);
      margin: 0 auto;
      object-fit: contain;
      border-radius: 4px;
      cursor: default;
    }

    .publication-preview-dialog-caption {
      margin: 10px 0 0;
      font-size: 0.9rem;
      line-height: 1.4;
      color: #c8d0d8;
    }

    .publication-preview-dialog-report {
      margin: 10px 0 0;
      font-size: 0.9rem;
    }

    .publication-preview-dialog-report a {
      color: #8ec8ff;
    }

    .contact-item {
      width: 100%;
      float: left;
    }

    .contact-item .icon {
      padding: 10px;
      border-right: 1px solid #ccc;
      border-bottom: 1px solid #ccc;
      color: #32475c;
      background: #eee;
    }

    .contact-item:last-child .icon {
      border-bottom: none;
    }

    .contact-item .title {
      width: 80%;
      width: calc(100% - 55px);
      font-weight: 700;
      opacity: 0.9;
    }

    .contact-item .title.only {
      margin-top: 10px;
    }

    .contact-item .description {
      width: 80%;
      width: calc(100% - 55px);
      color: #334960;
    }

    @media (max-width: 767px) {
      #awards,
      #education {
        padding-left: 0.15rem;
      }

      .project-card {
        padding: 10px;
      }

      .project-card-body {
        grid-template-columns: 1fr;
      }

      .project-diagram {
        max-width: 14rem;
        margin-left: auto;
        margin-right: auto;
      }

      .project-gallery {
        max-width: 18rem;
        margin-left: auto;
        margin-right: auto;
      }

      .job-gallery {
        grid-template-columns: 1fr;
        max-width: 20rem;
        margin-left: auto;
        margin-right: auto;
      }

      .project-embed iframe {
        height: 240px;
      }

      .hero-actions {
        display: flex;
      }

      .contact-cta .btn {
        width: 100%;
      }

      details.cv-section>summary {
        font-size: 1.35em;
        align-items: flex-start;
        padding-top: 6px;
        padding-bottom: 10px;
      }

      details.cv-section>summary::after {
        margin-top: 0.35em;
      }
    }

    .item-interests,
    .item-skills {
      height: 30px;
      color: #334960;
      padding: 5px 10px;
      margin-bottom: 5px;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      font-size: 1.1em;
      font-weight: 600;
    }

    .interest,
    .skill {
      color: #fff;
      display: inline-block;
      margin-right: 5px;
      margin-bottom: 5px;
      padding: 5px 10px;
      background: #32475c;
      position: relative;
      font-size: .85em;
    }

    a.skill.badge {
      color: #fff;
      text-decoration: none;
    }

    a.skill.badge:hover,
    a.skill.badge:focus {
      background: #3d5a73;
      text-decoration: underline;
    }

    .skill-badge-note {
      background: #4a6278;
      font-size: .8em;
    }

    .skill-group-body--certs .skill-tier-line {
      align-items: flex-start;
    }

    .skill-group-body--certs .skill-tier-line .skill-level {
      min-width: 5.75rem;
      margin-top: 2px;
    }

    .skill-group-body--certs .cert-validity {
      font-size: 0.78em;
      line-height: 1.35;
      color: #5d6a69;
      white-space: nowrap;
      padding-top: 2px;
    }

    .skill-group-body--certs .cert-tier-badges {
      display: flex;
      flex-wrap: wrap;
      gap: 6px 8px;
      flex: 1 1 12rem;
      min-width: 0;
    }

    .skill-level {
      background-color: #227c74;
      border-radius: 4px;
      color: #fff;
      padding: 1px 8px;
      font-size: .75em;
      position: absolute;
      margin: 1px 10px;
    }

    details.skill-group {
      margin-bottom: 8px;
      border: 1px solid #dde7e5;
      border-radius: 6px;
      background: #fafcfc;
      overflow: hidden;
    }

    details.skill-group > summary.skill-group-summary {
      list-style: none;
      display: flex;
      align-items: center;
      min-height: 30px;
      color: #334960;
      padding: 6px 10px;
      font-size: 1.1em;
      font-weight: 600;
      cursor: pointer;
      user-select: none;
      background: #f4faf9;
    }

    details.skill-group > summary.skill-group-summary::-webkit-details-marker {
      display: none;
    }

    details.skill-group > summary.skill-group-summary::after {
      content: '\f078';
      font-family: 'Font Awesome 5 Free';
      font-weight: 900;
      margin-left: auto;
      font-size: 0.7em;
      color: #227c74;
      opacity: 0.75;
      transition: transform 0.2s ease;
    }

    details.skill-group[open] > summary.skill-group-summary::after {
      transform: rotate(-180deg);
    }

    details.skill-group .skill-group-body {
      border-top: 1px solid #dde7e5;
      padding: 2px 0 4px;
    }

    details.skill-group .skill-tier-line {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 6px 8px;
      padding: 8px 12px 10px;
      margin: 0;
    }

    details.skill-group .skill-tier-line + .skill-tier-line {
      padding-top: 6px;
      border-top: 1px solid #eef3f2;
    }

    details.skill-group .skill-tier-line .skill-level {
      position: static;
      flex: 0 0 auto;
      margin: 0 6px 0 0;
      min-width: 6.75rem;
      line-height: 1.3;
      vertical-align: middle;
    }

    details.skill-group .skill-tier-line .skill {
      margin-right: 0;
      margin-bottom: 0;
    }

    details.skill-tier > summary.skill-tier-summary {
      list-style: none;
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 5px 10px 5px 14px;
      cursor: pointer;
      font-size: 0.92em;
      font-weight: 600;
      color: #32475c;
      user-select: none;
    }

    details.skill-tier > summary.skill-tier-summary::-webkit-details-marker {
      display: none;
    }

    details.skill-tier > summary.skill-tier-summary::after {
      content: '\f054';
      font-family: 'Font Awesome 5 Free';
      font-weight: 900;
      font-size: 0.65em;
      color: #227c74;
      opacity: 0.6;
      margin-left: auto;
      transition: transform 0.2s ease;
    }

    details.skill-tier[open] > summary.skill-tier-summary::after {
      transform: rotate(90deg);
    }

    details.skill-tier .skill-tier-badges {
      padding: 0 10px 8px 14px;
    }

    details.skill-tier .skill-tier-summary .skill-level {
      position: static;
      margin: 0;
    }

    #language-skills .skill {
      margin: 10px 0;
      padding-bottom: 10px;
      border-bottom: 1px solid #eee;
    }

    .clustrmaps-section {
      margin-top: 8px;
      padding: 0;
      border: 1px solid #dde7e5;
      border-radius: 8px;
      overflow: hidden;
      background: linear-gradient(180deg, #f8fcfb 0%, #fff 52%);
    }

    .clustrmaps-toggle {
      display: flex;
      align-items: center;
      gap: 10px;
      width: 100%;
      margin: 0;
      padding: 14px 16px;
      border: 0;
      border-bottom: 1px solid #e8eceb;
      background: transparent;
      text-align: left;
      cursor: pointer;
      transition: background-color 0.2s ease;
    }

    .clustrmaps-toggle:hover,
    .clustrmaps-toggle:focus {
      background: #e5f0ee;
    }

    .clustrmaps-toggle:focus-visible {
      outline: 2px solid #227c74;
      outline-offset: -2px;
    }

    .clustrmaps-section-title {
      flex: 1;
      font-size: 1.5em;
      font-weight: 700;
      text-transform: uppercase;
      color: #227c74;
      margin: 0;
      padding: 0;
      border: 0;
      pointer-events: none;
    }

    .clustrmaps-toggle-chevron {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 1.25em;
      color: #227c74;
      opacity: 0.7;
      transition: transform 0.2s ease;
    }

    .clustrmaps-toggle[aria-expanded='true'] .clustrmaps-toggle-chevron {
      transform: rotate(180deg);
    }

    .clustrmaps-panel {
      padding: 12px 16px 14px;
    }

    .clustrmaps-panel[hidden] {
      display: none;
    }

    .clustrmaps-frame {
      display: flex;
      justify-content: center;
      align-items: center;
      min-height: 210px;
      padding: 12px;
      border: 1px solid #dde7e5;
      border-radius: 6px;
      background: #f4faf9;
      text-align: center;
    }

    .clustrmaps-mount {
      width: 300px;
      max-width: 100%;
      min-height: 190px;
    }

    .clustrmaps-mount--ready {
      min-height: 0;
    }

    .clustrmaps-placeholder {
      display: flex;
      align-items: center;
      justify-content: center;
      min-height: 190px;
      margin: 0;
      font-size: 0.92em;
      color: #4d5a59;
    }

    .clustrmaps-placeholder[hidden] {
      display: none;
    }

    .clustrmaps-mount--ready .clustrmaps-placeholder {
      display: none;
    }

    .cv-section-heading {
      display: inline-flex;
      flex: 1 1 auto;
      align-items: center;
      flex-wrap: wrap;
      gap: 0.35em;
      min-width: 0;
      font-size: inherit;
      font-weight: inherit;
      line-height: 1.25;
      margin: 0;
      padding: 0;
      border: 0;
      overflow-wrap: break-word;
    }

    .skip-link {
      position: absolute;
      left: -9999px;
      top: auto;
      width: 1px;
      height: 1px;
      overflow: hidden;
      z-index: 2000;
      padding: 0.5rem 1rem;
      background: #227c74;
      color: #fff;
      text-decoration: none;
    }

    .skip-link:focus {
      left: 0.5rem;
      top: 0.5rem;
      width: auto;
      height: auto;
    }

    #particles-js {
      position: fixed;
      height: 350vh;
      background: #334960;
      /* Fallback color */
      background-size: cover;
      top: 0;
      left: 0;
      z-index: -1;
    }