/* Portfolio layer; shared by the homepage feature and case study. */
.work-section { padding: 6rem 0; background: #fff; scroll-margin-top: 6rem; }
.work-kicker { color: #2563eb; font-size: .875rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 1rem; }
.work-heading { font-size: clamp(2rem, 4vw, 3.25rem); line-height: 1.12; letter-spacing: -.035em; font-weight: 700; color: #0f172a; margin-bottom: 2rem; }
.work-card { display: grid; grid-template-columns: 1.3fr 1fr; border: 1px solid #e2e8f0; border-radius: 1.5rem; overflow: hidden; background: #f8fafc; }
.work-preview { display: flex; align-items: center; padding: 2rem; background: #e8f2ef; }
.work-preview img { width: 100%; height: auto; border: 1px solid #c7dcd6; border-radius: .65rem; box-shadow: 0 16px 40px #0f172a14; }
.work-copy { padding: clamp(1.5rem, 4vw, 3rem); align-self: center; }
.work-copy h3 { font-size: 2rem; font-weight: 700; letter-spacing: -.03em; color: #0f172a; margin: .75rem 0 1rem; }
.work-copy p, .work-prose p { color: #475569; line-height: 1.8; }
.work-tags { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; margin: 0 0 1.5rem; }
.work-tags li { border: 1px solid #cbd5e1; border-radius: 999px; padding: .3rem .7rem; color: #334155; font-size: .8rem; }
.work-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.75rem; }
.work-button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .8rem 1.2rem; border: 1px solid #cbd5e1; border-radius: 999px; background: #fff; color: #0f172a; font-size: .9rem; font-weight: 600; text-decoration: none; }
.work-button:hover { border-color: #2563eb; color: #1d4ed8; }
.work-button-primary { background: #0f172a; border-color: #0f172a; color: #fff; }
.work-button-primary:hover { background: #1e293b; color: #fff; }
.work-section a:focus-visible, .case-study a:focus-visible { outline: 3px solid #2563eb; outline-offset: 4px; }
.case-study { padding: 9rem 0 5rem; }
.work-shell { max-width: 1160px; margin: 0 auto; padding: 0 1.5rem; }
.work-breadcrumb { display: flex; flex-wrap: wrap; gap: .6rem; font-size: .875rem; color: #475569; margin-bottom: 2.5rem; }
.work-breadcrumb a { text-decoration: underline; text-underline-offset: 3px; }
.work-title { font-size: clamp(2.75rem, 6vw, 4.75rem); letter-spacing: -.045em; font-weight: 700; line-height: 1.06; max-width: 900px; margin: 0 0 1.5rem; }
.work-intro { font-size: 1.2rem; line-height: 1.7; max-width: 760px; color: #475569; }
.work-hero { margin: 3rem 0; padding: clamp(.75rem, 3vw, 2rem); background: #e8f2ef; border-radius: 1.5rem; }
.work-hero img, .work-detail img { display: block; width: 100%; height: auto; border-radius: .65rem; border: 1px solid #c7dcd6; }
.case-study figcaption { color: #475569; font-size: .85rem; line-height: 1.6; margin-top: .8rem; }
.work-prose { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; margin: 3rem 0; }
.work-prose h2, .work-gallery h2, .work-result h2 { font-size: 1.75rem; font-weight: 700; letter-spacing: -.025em; margin-bottom: 1rem; }
.work-prose p + p { margin-top: 1rem; }
.work-prose ul { list-style: disc; padding-left: 1.25rem; color: #475569; line-height: 1.8; }
.work-prose li + li { margin-top: .65rem; }
.work-gallery { margin: 4rem 0; }
.work-gallery-grid { display: grid; grid-template-columns: 1fr .36fr; align-items: start; gap: 2rem; }
.work-detail { margin: 0; min-width: 0; }
.work-result { border-top: 1px solid #e2e8f0; padding-top: 3rem; max-width: 760px; }
.work-result p { color: #475569; line-height: 1.8; }
.work-cta { padding: 2.5rem; margin-top: 3rem; background: #eff6ff; border-radius: 1.5rem; }
.work-cta h2 { font-size: 1.75rem; font-weight: 700; margin-bottom: .75rem; }
.work-cta p { color: #475569; line-height: 1.7; }
@media (max-width: 767px) {
  .work-section { padding: 4rem 0; }
  .work-card, .work-prose { grid-template-columns: 1fr; }
  .work-preview { padding: 1rem; }
  .work-prose { gap: 2rem; }
  .work-gallery-grid { grid-template-columns: 1fr; }
  .work-mobile { max-width: 320px; margin: 0 auto; }
  .case-study { padding-top: 7rem; }
  .work-cta { padding: 1.5rem; }
}