/* Majic Engage page — screen clips and the suite grid (2026-09-09). Inherits base/style/takeoff. */
figure.screen { margin: var(--space-8, 2rem) 0 0; }
figure.screen img { display: block; width: 100%; height: auto; border-radius: 14px; border: 1px solid rgba(127,127,127,.25); box-shadow: 0 18px 50px rgba(0,0,0,.28); background: #fff; }
figure.screen figcaption { margin-top: .6rem; font-size: .85rem; opacity: .7; }
.screen-pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6, 1.5rem); margin-top: var(--space-8, 2rem); }
@media (max-width: 860px) { .screen-pair { grid-template-columns: 1fr; } }
.suite-grid .card .pill { display: inline-block; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; padding: .2rem .6rem; border-radius: 999px; border: 1px solid rgba(127,127,127,.35); margin-bottom: .6rem; }
.suite-grid .card .hand { margin-top: .8rem; font-size: .88rem; opacity: .75; border-top: 1px dashed rgba(127,127,127,.3); padding-top: .6rem; }
.suite-grid .card h3 a { text-decoration: none; }
.stat-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4, 1rem); }
.stat-strip div { padding: 1rem 1.2rem; border: 1px solid rgba(127,127,127,.25); border-radius: 12px; }
.stat-strip strong { display: block; font-size: 1.5rem; font-family: 'Bricolage Grotesque', sans-serif; }
.stat-strip span { font-size: .85rem; opacity: .7; }
@media (max-width: 720px) { .stat-strip { grid-template-columns: 1fr 1fr; } }