.portfolio-shell { width: 100%; }
.portfolio-shell > :not(.portfolio-projects) { box-sizing: border-box; width: 100%; padding-inline: 24px; }
.portfolio-shell > header { flex-wrap: wrap; }
.portfolio-projects { width: 100%; padding-bottom: 0; }
.project-band { width: 100%; }
.project-content { width: 100%; }
.project-article > header { padding-inline: 24px; }
.project-article > header h2 { flex-wrap: wrap; overflow: visible; white-space: normal; }
.project-article > header h2 > span { flex-shrink: 1; overflow-wrap: anywhere; }
.project-article > :not(header, dental-crm-preview, calls-llm-preview, shifts-crm-preview, eicom-shop-preview, tm-electronics-preview, furniture-1c-preview, payments-1c-preview, receipts-1c-preview, contracts-1c-preview, party-1c-preview):not(:has(dental-crm-preview, calls-llm-preview, shifts-crm-preview, eicom-shop-preview, tm-electronics-preview, furniture-1c-preview, payments-1c-preview, receipts-1c-preview, contracts-1c-preview, party-1c-preview)) { padding-inline: 24px; }
.project-content > :last-child { margin-inline: 24px; }
.project-band a:focus-visible, .project-band button:focus-visible { outline-color: var(--project-title); }
@media (max-width: 600px) {
  .portfolio-shell > :not(.portfolio-projects), .project-article > header { padding-inline: 16px; }
  .project-article > :not(header, dental-crm-preview, calls-llm-preview, shifts-crm-preview, eicom-shop-preview, tm-electronics-preview, furniture-1c-preview, payments-1c-preview, receipts-1c-preview, contracts-1c-preview, party-1c-preview):not(:has(dental-crm-preview, calls-llm-preview, shifts-crm-preview, eicom-shop-preview, tm-electronics-preview, furniture-1c-preview, payments-1c-preview, receipts-1c-preview, contracts-1c-preview, party-1c-preview)) { padding-inline: 16px; }
  .project-content > :last-child { margin-inline: 16px; }
}