/* ============================================================================
   ADVOKE CV — templates/family-tech.css
   Layout family: tech
   Technical layout with a skills matrix at the top and experience /
   projects below. Used by Software Engineer, IT Professional, Data Analyst
   and Engineering Professional.
   ============================================================================ */

.resume--tech > .layout--tech {
  display: block;
}

.layout--tech .resume-tech__header {
  padding-bottom: var(--t-block-gap);
  margin-bottom: var(--t-section-gap);
  border-bottom: 1px solid var(--t-rule);
}

/* Skills matrix block sits directly under the header. */
.layout--tech .resume-tech__matrix {
  margin-bottom: var(--t-section-gap);
}

.layout--tech .resume-tech__matrix .resume-section {
  margin: 0;
}

.layout--tech .resume-tech__matrix .resume-section + .resume-section {
  margin-top: calc(var(--t-section-gap) - 2px);
}

.layout--tech .resume-tech__body {
  display: block;
}

.layout--tech .resume-tech__body .resume-section + .resume-section {
  margin-top: var(--t-section-gap);
}

/* The matrix itself uses CSS grid columns from --t-matrix-columns. When
 * the config asks for a two-column matrix we bias the rows tighter so a
 * long skill list fits on a single page. */
.layout--tech .resume-matrix[data-columns="2"] {
  gap: 0.5em 1.2em;
}

.layout--tech .resume-matrix[data-columns="3"] {
  gap: 0.5em 1em;
}

/* Inline stack lines under projects and roles. */
.layout--tech .resume-inline-list {
  font-size: calc(var(--t-fs-base) - 0.6pt);
}

/* Certifications above the matrix (used by IT Professional) get a subtle
 * separation to keep the page from feeling stacked. */
.layout--tech .resume-tech__matrix .resume-section--certifications + .resume-section--skills {
  padding-top: calc(var(--t-section-gap) - 4px);
  border-top: 1px solid var(--t-rule);
}