/* Actual board screenshot with a short explanation of account capabilities. */
.cabinet-heading { display:grid; grid-template-columns:1.3fr 1fr; gap:72px; align-items:end; margin-bottom:42px; }
.cabinet-heading h2 { font-size:clamp(36px,3.8vw,52px); }
.cabinet-heading p { max-width:470px; font-size:19px; line-height:1.6; color:var(--muted); padding-bottom:4px; }
.cabinet-overview { display:grid; grid-template-columns:minmax(0,1.8fr) minmax(310px,1fr); gap:48px; align-items:start; }
.cabinet-board { margin:0; min-width:0; }
.cabinet-board-preview { display:block; padding:22px; background:#f5f7fa; border:1px solid #d9e2ee; border-radius:12px; transition:border-color 160ms; }
.cabinet-board-heading { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-bottom:20px; }
.cabinet-board-heading strong { font-size:20px; font-weight:600; }
.cabinet-board-heading > span { display:flex; align-items:center; gap:8px; color:var(--blue-dark); font-size:13px; }
.cabinet-board-heading svg { width:17px; height:17px; }
.cabinet-board-preview img { display:block; width:100%; height:auto; border-radius:7px; }
.cabinet-board-preview:hover { border-color:#88adde; }
.cabinet-board-preview:focus-visible { outline:2px solid var(--blue); outline-offset:4px; }
.cabinet-board figcaption { color:var(--muted); font-size:12px; line-height:1.6; margin-top:12px; }
.cabinet-benefits ul { list-style:none; display:grid; gap:26px; margin:0; padding:0; }
.cabinet-benefits li { display:grid; grid-template-columns:24px 1fr; gap:14px; }
.cabinet-benefits li > svg { width:22px; height:22px; color:var(--blue-dark); margin-top:2px; }
.cabinet-benefits h3 { font-size:20px; font-weight:550; line-height:1.3; }
.cabinet-benefits p { margin-top:7px; font-size:15px; line-height:1.6; color:var(--muted); }
.cabinet-benefits .button { margin-top:30px; min-height:54px; padding:16px 23px; font-size:15px; }
.cabinet-stats { display:flex; align-items:center; gap:12px; font-size:13px; min-height:44px; margin-top:7px; color:var(--blue-dark); }
.cabinet-stats svg { width:18px; height:18px; }
.cabinet-stats:hover { text-decoration:underline; text-underline-offset:4px; }
.cabinet-zoom { position:fixed; inset:0; margin:auto; width:min(944px,calc(100% - 32px)); max-height:calc(100dvh - 32px); padding:24px; border:1px solid #d9e2ee; border-radius:12px; color:var(--ink); background:#f5f7fa; overflow:auto; }
.cabinet-zoom::backdrop { background:#0e2244b3; }
.cabinet-zoom-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:20px; }
.cabinet-zoom h3 { font-size:24px; }
.cabinet-zoom-heading button { display:grid; place-items:center; flex:none; width:44px; height:44px; border:1px solid #d9e2ee; border-radius:8px; background:#fff; color:var(--ink); cursor:pointer; }
.cabinet-zoom-heading svg { width:22px; height:22px; }
.cabinet-zoom-scroll { overflow:auto; overscroll-behavior:contain; max-height:calc(100dvh - 160px); }
.cabinet-zoom-scroll img { display:block; width:870px; max-width:none; height:auto; }
.cabinet-zoom-hint { display:none; font-size:13px; color:var(--muted); margin-bottom:16px; }
.cabinet-zoom :focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
@media(max-width:1100px) {
 .cabinet-overview { grid-template-columns:minmax(0,1.5fr) minmax(290px,1fr); gap:30px; }
 .cabinet-heading { gap:40px; }
 .cabinet-heading p { font-size:17px; }
 .cabinet-board-preview { padding:16px; }
 .cabinet-benefits ul { gap:22px; }
 .cabinet-benefits h3 { font-size:18px; }
}
@media(max-width:800px) {
 .cabinet-heading { grid-template-columns:1fr; gap:20px; margin-bottom:30px; }
 .cabinet-heading p { max-width:600px; }
 .cabinet-overview { grid-template-columns:1fr; gap:32px; }
 .cabinet-benefits ul { grid-template-columns:1fr 1fr; gap:28px; }
 .cabinet-zoom-hint { display:block; }
}
@media(max-width:500px) {
 .cabinet-heading h2 { font-size:36px; }
 .cabinet-heading p { font-size:16px; }
 .cabinet-board-preview { padding:12px; }
 .cabinet-board-heading { margin-bottom:14px; gap:10px; }
 .cabinet-board-heading strong { font-size:17px; }
 .cabinet-board-heading > span { font-size:12px; }
 .cabinet-benefits ul { grid-template-columns:1fr; gap:24px; }
 .cabinet-benefits h3 { font-size:19px; }
 .cabinet-benefits .button { width:100%; justify-content:space-between; }
 .cabinet-zoom { padding:16px; width:calc(100% - 20px); }
 .cabinet-zoom h3 { font-size:20px; }
 .cabinet-zoom-scroll { max-height:calc(100dvh - 190px); }
}
@media(prefers-reduced-motion:reduce) { .cabinet-board-preview { transition:none; } }
