/* EXPERTISE TRUE PORTRAIT CARDS v113 */

body.footer-layout[data-story-page="skills"] > main{
  display:block!important;
  min-height:0!important;
}
body.footer-layout[data-story-page="skills"] .spatial-story{
  padding:28px 0 30px!important;
  min-height:0!important;
}
body[data-story-page="skills"] .story-layout{
  width:min(calc(100% - 48px), var(--max))!important;
  margin:0 auto!important;
  display:block!important;
}
body[data-story-page="skills"] .compact-story-records{
  display:block!important;
}
body[data-story-page="skills"] .story-intro{
  margin:0 0 20px!important;
  padding:0 0 14px!important;
  border-bottom:1px solid var(--line)!important;
}
body[data-story-page="skills"] .story-intro h1{
  margin:0 0 6px!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:clamp(2rem, 3vw, 2.45rem)!important;
  line-height:1.08!important;
  color:var(--primary2)!important;
}
body[data-story-page="skills"] .story-intro p{
  margin:0!important;
  max-width:760px!important;
  font-size:.9rem!important;
  line-height:1.55!important;
  color:var(--muted)!important;
}

/* centered portrait-card group */
body[data-story-page="skills"] .story-chapters{
  display:flex!important;
  justify-content:center!important;
  align-items:stretch!important;
  gap:24px!important;
  flex-wrap:nowrap!important;
}

body[data-story-page="skills"] .story-chapter{
  flex:0 1 332px!important;
  max-width:332px!important;
  min-width:0!important;
  min-height:615px!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:198px minmax(390px, 1fr)!important;
  background:var(--surface)!important;
  border:1px solid var(--line)!important;
  border-radius:8px!important;
  overflow:hidden!important;
  box-shadow:none!important;
}

body[data-story-page="skills"] .story-step,
body[data-story-page="skills"] .story-chapter-kicker{
  display:none!important;
}

/* top landscape image */
body[data-story-page="skills"] .story-chapter-media{
  width:100%!important;
  height:198px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-bottom:1px solid var(--line)!important;
  background:var(--surface2)!important;
  overflow:hidden!important;
}
body[data-story-page="skills"] .story-chapter-media img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
}
body[data-story-page="skills"] .story-chapter:nth-child(1) .story-chapter-media img{
  object-fit:contain!important;
  background:#fff!important;
  padding:12px!important;
}

/* lower portrait content block */
body[data-story-page="skills"] .story-chapter-body{
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  min-width:0!important;
  min-height:0!important;
  padding:18px 18px 16px!important;
}
body[data-story-page="skills"] .story-chapter-main{
  min-width:0!important;
}
body[data-story-page="skills"] .story-chapter h2{
  margin:0 0 9px!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:1.13rem!important;
  line-height:1.22!important;
  color:var(--primary2)!important;
}
body[data-story-page="skills"] .story-summary{
  margin:0!important;
  font-size:.78rem!important;
  line-height:1.58!important;
  color:var(--muted)!important;
}
body[data-story-page="skills"] .story-skill-focus{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  margin:14px 0 0!important;
}
body[data-story-page="skills"] .story-skill-focus span{
  display:inline-flex!important;
  align-items:center!important;
  padding:5px 8px!important;
  border:1px solid var(--line)!important;
  border-radius:4px!important;
  background:var(--surface2)!important;
  color:var(--text)!important;
  font-size:.64rem!important;
  line-height:1.25!important;
  font-weight:700!important;
}
body[data-story-page="skills"] .story-chapter-meta{
  margin-top:auto!important;
  padding-top:15px!important;
  border-top:1px solid var(--line)!important;
}
body[data-story-page="skills"] .story-more{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  width:max-content!important;
  margin:0!important;
  padding:8px 12px!important;
  border:1px solid var(--line)!important;
  border-radius:4px!important;
  background:var(--neutral-button)!important;
  color:var(--primary)!important;
  font-size:.7rem!important;
  line-height:1.2!important;
  font-weight:800!important;
  box-shadow:none!important;
}
body[data-story-page="skills"] .story-more:hover,
body[data-story-page="skills"] .story-more:focus-visible{
  background:var(--neutral-button-hover)!important;
  border-color:var(--accent)!important;
  color:var(--primary2)!important;
}
body[data-story-page="skills"] .story-chapter.is-active{
  border-color:var(--line)!important;
  box-shadow:none!important;
}

@media(max-width:1180px){
  body[data-story-page="skills"] .story-chapters{
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
    justify-content:stretch!important;
    gap:18px!important;
  }
  body[data-story-page="skills"] .story-chapter{
    max-width:none!important;
    min-height:590px!important;
  }
  body[data-story-page="skills"] .story-chapter:nth-child(3){
    grid-column:1 / -1!important;
    justify-self:center!important;
    width:min(360px, 100%)!important;
  }
}

@media(max-width:760px){
  body.footer-layout[data-story-page="skills"] .spatial-story{
    padding:22px 0 26px!important;
  }
  body[data-story-page="skills"] .story-layout{
    width:calc(100% - 32px)!important;
  }
  body[data-story-page="skills"] .story-chapters{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  body[data-story-page="skills"] .story-chapter,
  body[data-story-page="skills"] .story-chapter:nth-child(3){
    width:100%!important;
    max-width:none!important;
    min-height:0!important;
    grid-template-rows:172px auto!important;
  }
  body[data-story-page="skills"] .story-chapter-media{
    height:172px!important;
  }
  body[data-story-page="skills"] .story-chapter-body{
    padding:15px 14px 14px!important;
  }
}