.portal-case { order: 6; display: grid; grid-template-columns: 1fr 1.15fr; align-items: center; gap: 38px; width: min(1200px, calc(100% - 64px)); margin: 70px auto 40px; padding: 48px; border-radius: 30px; background: linear-gradient(125deg,#f1f9f6,#eeebfc); border: 1px solid #e3e1ec; color: #191c26; }
.portal-case-copy { min-width: 0; }
.portal-case-label { color: #6244c3; font-size: .68rem; font-weight: 700; letter-spacing: .12em; line-height: 1.8; }
.portal-case h2 { font: 500 clamp(1.9rem,3vw,2.7rem)/1.15 Manrope, sans-serif; letter-spacing: -.04em; margin: 20px 0; }
.portal-case-description { color: #565c69; font-size: .94rem; line-height: 1.8; }
.portal-case-link { display: inline-flex; gap: 32px; margin-top: 28px; background: #171a23; color: #fff; padding: 16px 22px; border-radius: 12px; text-decoration: none; font-weight: 600; }
.portal-case-preview { position: relative; display: block; min-width: 0; padding: 34px 28px 28px 42px; transform: rotate(-1deg); }
.portal-preview-stack { position: absolute; inset: 0; pointer-events: none; }
.portal-preview-page { position: absolute; display: block; overflow: hidden; border-radius: 14px; background: linear-gradient(135deg,#111622,#27213d); box-shadow: 0 22px 44px #27203b1f; }
.portal-preview-page::before { position: absolute; inset: 0; background-image: url("../assets/portal-preview-sv.png"); background-size: cover; background-position: center; opacity: .58; content: ""; }
.portal-preview-page--back { inset: 5px 42px 42px 2px; transform: rotate(-7deg); opacity: .58; }
.portal-preview-page--middle { inset: 20px 14px 18px 22px; transform: rotate(4deg); opacity: .78; }
.portal-case-preview img { position: relative; z-index: 2; display: block; width: 100%; height: auto; border-radius: 14px; box-shadow: 0 26px 54px #27203b2e; transform: rotate(-1deg); }
.portal-case a:focus-visible { outline: 3px solid #7154da; outline-offset: 5px; }
@media(max-width: 900px) { .portal-case { grid-template-columns: 1fr; padding: 30px; } .portal-case-preview { padding: 28px 20px 22px 30px; } }
@media(max-width: 480px) { .portal-case { width: calc(100% - 32px); padding: 24px; gap: 30px; } .portal-case-preview { padding: 20px 12px 16px 20px; } }