.portal-section { padding: 112px 4.45vw 92px; background: var(--paper); }
.portal-heading { display: grid; grid-template-columns: 1.6fr 1fr; align-items: end; gap: 6vw; margin-bottom: 48px; }
.portal-heading .eyebrow { display: inline-flex; align-items: center; gap: 12px; }
.portal-heading .eyebrow::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--violet); }
.portal-heading h2 { margin: 22px 0 0; font-size: clamp(48px, 6.6vw, 112px); letter-spacing: -.065em; line-height: 1; }
.portal-intro { justify-self: end; margin: 0 0 4px; color: var(--muted); font-size: clamp(16px, 1.4vw, 22px); line-height: 1.5; }
.portal-window { padding: 24px; background: #f1eef9; }
#portal-frame { display: block; width: 100%; height: clamp(360px, calc(100svh - var(--portal-nav-height, 86px) - 64px), 790px); border: 1px solid #d9d4e5; border-radius: 12px; background: white; box-shadow: 0 12px 35px -22px #25145540; }
.portal-closing { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 36px; }
.portal-closing p { margin: 0; font-size: clamp(20px, 2vw, 30px); line-height: 1.4; letter-spacing: -.035em; }
.portal-closing p span { color: var(--muted); }
.portal-access { padding: 14px 0; border-bottom: 1px solid var(--ink); font-size: 14px; white-space: nowrap; }
.portal-access:hover { color: var(--violet); border-color: var(--violet); }
@media (min-width: 1700px) { .portal-section > * { max-width: 1610px; margin-inline: auto; } }
@media (max-width: 1050px) { .portal-window { padding: 16px; } }
@media (max-width: 700px) {
  .portal-section { padding: 68px 22px 60px; }
  .portal-heading { grid-template-columns: 1fr; gap: 24px; margin-bottom: 30px; }
  .portal-heading .eyebrow { font-size: 11px; }
  .portal-heading h2 { font-size: clamp(42px, 11vw, 76px); margin-top: 20px; }
  .portal-intro { justify-self: start; font-size: 16px; }
  .portal-window { padding: 10px; margin-inline: -12px; }
  #portal-frame { height: clamp(360px, calc(100svh - var(--portal-nav-height, 68px) - 40px), 850px); border-radius: 9px; }
  .portal-closing { flex-direction: column; align-items: start; gap: 20px; margin-top: 26px; }
  .portal-closing p { font-size: 21px; }
  .portal-access { font-size: 13px; }
}
