@scope (.portfolio-content) {
.shell{width:min(100% - 32px,1180px);margin-inline:auto}
    section {
      padding: 82px 0;
      border-bottom: 1px solid var(--line);
    }

    .section-head {
      display: flex;
      justify-content: space-between;
      gap: 24px;
      align-items: end;
      margin-bottom: 28px;
    }

    h2 {
      font-family: var(--display);
      font-size: clamp(42px, 5vw, 76px);
      line-height: 1;
    }

    h2 span {
      display: block;
    }

    #business h2 {
      max-width: 720px;
      font-family: var(--display);
      font-size: clamp(42px, 5vw, 76px);
      font-weight: 900;
      line-height: 1;
    }

    #work .section-head,
    #skills .section-head,
    #business .section-head {
      justify-content: center;
      text-align: center;
    }

    #contact h2 {
      text-align: center;
    }

    .business-note {
      margin-top: 14px;
      color: var(--muted);
      font-size: 18px;
      font-weight: 700;
      text-align: center;
    }

    .sponsor-portal {
      padding: 0 0 82px;
    }

    .sponsor-portal-card {
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: end;
      gap: 30px;
      padding: clamp(28px, 4vw, 52px);
      background: #172b20;
      color: var(--paper);
    }

    .sponsor-portal-card h2 {
      font-size: clamp(40px, 4.3vw, 62px);
    }

    .sponsor-portal-card p {
      max-width: 560px;
      margin-top: 16px;
      color: #d4ddd0;
      font-size: 17px;
    }

    .sponsor-portal-card .button {
      border-color: var(--paper);
      color: var(--paper);
    }

    .work {
      display: grid;
      gap: 18px;
    }

    .case {
      border: 1px solid var(--line-strong);
      background: var(--paper);
    }

    .case-media {
      margin-top: 24px;
      min-height: 320px;
      display: grid;
      place-items: center;
      background: var(--dark);
      padding: 18px;
    }

    .case-media img,
    .case-media video {
      width: 100%;
      border: 1px solid rgba(245, 243, 238, 0.18);
    }

    .case-media-note {
      width: 100%;
      border: 1px solid rgba(245, 243, 238, 0.18);
      padding: 28px;
      color: var(--paper);
    }

    .case-media-note strong {
      display: block;
      font-family: var(--display);
      font-size: clamp(30px, 5vw, 58px);
      line-height: 1;
    }

    .case-media-note span {
      display: block;
      max-width: 520px;
      margin-top: 14px;
      color: rgba(245, 243, 238, 0.68);
      font-size: 16px;
    }

    .case-copy {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 24px;
      background: var(--paper);
      padding: 26px;
    }

    h3 {
      font-family: var(--display);
      font-size: clamp(32px, 4vw, 54px);
      line-height: 1;
    }

    .case-description {
      max-width: 920px;
      margin-top: 22px;
      color: var(--muted);
      font-size: clamp(17px, 1.35vw, 20px);
      line-height: 1.65;
    }

    .tags {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 20px;
    }

    .tag {
      border: 1px solid var(--line);
      padding: 7px 9px;
      color: var(--muted);
      font-size: 13px;
    }

    .text-link {
      width: fit-content;
      border: 0;
      border-bottom: 1px solid var(--ink);
      background: transparent;
      color: inherit;
      font: inherit;
      padding-bottom: 4px;
      font-weight: 700;
      cursor: pointer;
    }

    .skills-note {
      max-width: 680px;
      margin: 16px auto 0;
      color: var(--muted);
      font-size: 18px;
      font-weight: 700;
      line-height: 1.7;
    }

    .skill-card {
      display: grid;
      grid-template-columns: minmax(460px, 1.1fr) minmax(0, 1.25fr);
      border: 1px solid var(--line-strong);
      background: var(--paper);
    }

    .skill-summary h3 {
      font-size: clamp(32px, 3.35vw, 45px);
      white-space: nowrap;
    }

    .skill-summary,
    .skill-install {
      min-width: 0;
      padding: clamp(24px, 4vw, 42px);
    }

    .skill-summary {
      border-left: 1px solid var(--line-strong);
    }

    .skill-kicker {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 20px;
      color: var(--green);
      font-size: 14px;
      font-weight: 700;
    }

    .skill-description {
      max-width: 620px;
      margin-top: 22px;
      color: var(--muted);
      font-size: 18px;
      line-height: 1.75;
    }

    .skill-install {
      display: flex;
      flex-direction: column;
      justify-content: center;
      background: var(--dark);
      color: var(--paper);
    }

    .install-label {
      font-size: 15px;
      font-weight: 700;
    }

    .install-command {
      direction: ltr;
      display: flex;
      align-items: stretch;
      gap: 10px;
      margin-top: 14px;
    }

    .install-command code {
      min-width: 0;
      flex: 1;
      border: 1px solid rgba(245, 243, 238, 0.28);
      background: rgba(245, 243, 238, 0.07);
      padding: 14px;
      color: var(--paper);
      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
      font-size: 12px;
      line-height: 1.55;
      text-align: left;
      white-space: normal;
      overflow-wrap: anywhere;
      unicode-bidi: isolate;
    }

    .copy-command {
      display: grid;
      flex: 0 0 48px;
      width: 48px;
      min-height: 48px;
      place-items: center;
      border: 1px solid var(--paper);
      background: transparent;
      color: var(--paper);
      padding: 0;
      cursor: pointer;
    }

    .copy-command svg {
      width: 20px;
      height: 20px;
      fill: none;
      stroke: currentColor;
      stroke-linecap: round;
      stroke-linejoin: round;
      stroke-width: 1.8;
    }

    .copy-command:focus-visible,
    .copy-command:hover {
      background: var(--paper);
      color: var(--ink);
    }

    .skill-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 24px;
    }

    .skill-actions .button {
      border-color: rgba(245, 243, 238, 0.7);
      color: var(--paper);
    }

    .copy-status {
      min-height: 22px;
      margin-top: 10px;
      color: #a6e7bd;
      font-size: 13px;
      font-weight: 700;
    }


h2{line-height:1.5}button{font-family:inherit;cursor:pointer}
@media(max-width:880px){.case,.skill-card{grid-template-columns:minmax(0,1fr)}.skill-summary{border-bottom:1px solid var(--line-strong);border-left:0}.skill-summary h3{font-size:clamp(32px,4vw,54px);white-space:normal}.case-media{min-height:0}}
@media(max-width:560px){section{padding:48px 0}.case-copy,.skill-summary,.skill-install{padding:22px}.case-media{padding:10px}.case-description{font-size:17px}.section-head{display:block}}
}