/* Новые направления: вымышленные данные, интерфейсы без снимков закрытых проектов. */
@font-face{font-family:"Services Inter";src:url("assets/services-inter-variable.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap}
.service-extra-label{display:flex;align-items:center;gap:7px;font:500 11px/1.4 "Services Inter",Arial,sans-serif;color:#687795;min-height:44px}
.service-extra-label:before{content:"";width:6px;height:6px;border-radius:50%;background:#7a93b3}
.service-extra-preview{height:324px;min-width:0;border-radius:13px;padding:17px 16px;background:#f0f2f8;overflow:hidden;font:400 11px/1.45 "Services Inter",Arial,sans-serif;color:#202b40;isolation:isolate}
.service-extra-preview *{box-sizing:border-box}
.service-extra-preview strong{font-weight:650}
.extra-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px;margin-bottom:17px;color:#738199}
.extra-toolbar>strong{color:#334464;letter-spacing:.07em;font-size:9px}
.extra-window{border-radius:10px;border:1px solid #dce2ec;background:#fff;overflow:hidden;height:258px;box-shadow:0 7px 24px #2a386e0c}
.extra-window-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:1px solid #edf0f5}
.extra-window-head>strong{font-size:12px;letter-spacing:-.25px}
.extra-window-head>span{font-size:8px;color:#70809c}
.extra-view-chip{font-size:8px;background:#eef2fc;color:#476291;padding:4px 7px;border-radius:5px;white-space:nowrap}
.task-preview{background:#e9ecf7}
.task-focus{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px;background:#f8f9fd}
.task-focus>div>strong{display:block;font-size:16px;letter-spacing:-.6px;color:#141d33}
.task-focus>div>span{font-size:8px;color:#7b89a2}
.task-progress{position:relative;display:grid;place-items:center;width:38px;height:38px;border:4px solid #e5e8f4;border-top-color:#485dff;border-right-color:#485dff;border-radius:50%;font-size:9px;color:#425586}
.task-preview-list{padding:0 12px;display:grid;gap:0}
.task-preview-row{display:flex;align-items:center;gap:9px;padding:11px 0;border-bottom:1px solid #edf0f5}
.task-preview-row>i{width:13px;height:13px;border:1px solid #c9d1e5;border-radius:4px;flex:none}
.task-preview-row>div{min-width:0;flex:1}
.task-preview-row strong{display:block;font-size:10px}
.task-preview-row small{font-size:8px;color:#8190a6}
.task-preview-row>span{font-size:8px;color:#7383a0;white-space:nowrap}
.task-preview-row.is-complete>i{background:#ecefff;color:#4059ef;border-color:#bac6ff;position:relative}
.task-preview-row.is-complete>i:after{content:"✓";position:absolute;inset:-2px 0 0;text-align:center;font-size:11px}
.task-preview-row.is-complete strong{text-decoration:line-through;color:#8490a6}
.task-focus>div>strong{font-size:14px;line-height:1.2}
.task-focus>div>span{display:block;line-height:1.2;margin-top:3px}
.task-preview-row{padding:9px 0}
.task-preview-row strong{line-height:1.25}
.task-preview-row small{display:block;line-height:1.3;margin-top:2px}
.task-preview-bottom{display:flex;align-items:center;gap:7px;color:#8e9ab0;font-size:8px;padding:12px}
.task-preview-bottom i{width:5px;height:5px;border-radius:50%;background:#91a5d8}
.video-preview{background:#111b2d;color:#d7e1f3}
.video-preview .extra-toolbar{color:#8b9bb8}.video-preview .extra-toolbar>strong{color:#e4eafa}
.video-preview .extra-window{background:#19263b;border-color:#34415b;box-shadow:none}
.video-preview .extra-window-head{border-color:#34415b}.video-preview .extra-window-head>span{color:#92a3be}
.video-preview .extra-view-chip{background:#2a3a54;color:#a7bbd9}
.video-queue{display:grid;gap:10px;padding:12px}
.video-queue-row{display:flex;align-items:center;gap:10px;min-width:0}
.video-thumbnail{width:45px;height:41px;flex:none;border-radius:6px;background:linear-gradient(135deg,#729de9,#263b79);display:grid;place-items:center;position:relative;overflow:hidden}
.video-thumbnail:before{content:"";width:26px;height:26px;border-radius:50%;border:1px solid #dce9ff55;position:absolute;left:-7px;top:4px}
.video-thumbnail:after{content:"";border-left:7px solid #edf2ff;border-top:4px solid transparent;border-bottom:4px solid transparent;filter:drop-shadow(0 2px 3px #121b4080)}
.video-thumbnail.second{background:linear-gradient(135deg,#bd8098,#553e71)}
.video-thumbnail.third{background:linear-gradient(135deg,#4fbda8,#1f5b6a)}
.video-queue-row>div:nth-child(2){flex:1;min-width:0}
.video-queue-row strong{display:block;font-size:10px;color:#f0f4ff}
.video-queue-row small{display:block;font-size:8px;color:#97a7c0;margin-top:2px}
.video-state{font-size:7px;border-radius:5px;padding:5px 6px;white-space:nowrap;color:#a9ddcc;background:#24443e}
.video-state.waiting{color:#b7c8ec;background:#2e3e5d}
.video-upload-meter{display:flex;align-items:center;justify-content:space-between;padding:8px 12px 5px;font-size:8px;color:#9aacc8}
.video-upload-meter>strong{color:#ccd9f2;font-size:8px}
.video-upload-track{height:4px;background:#304059;margin:0 12px;border-radius:4px}
.video-upload-track:after{content:"";display:block;width:68%;height:100%;border-radius:4px;background:#81a7ff}
.video-preview-footer{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:11px 12px 0;border-top:1px solid #34415b;padding-top:9px;font-size:8px;color:#9aaac4}
.video-preview-footer>span:last-child{color:#b7d8c5}
.email-preview{background:#f0ebe4}
.email-preview .extra-toolbar>strong{color:#796348}
.email-sheet{height:258px;padding:16px 19px;background:#fff;border:1px solid #e6dfd6;border-radius:8px;box-shadow:0 7px 22px #80684c0b}
.email-mark{font-size:8px;letter-spacing:.2em;font-weight:700;color:#8a7357}
.email-sheet h4{font:600 24px/1.08 Georgia,serif;letter-spacing:-.8px;margin:15px 0 9px;color:#29271f}
.email-sheet>p{font-size:9px;line-height:1.6;color:#857766;margin:0 0 12px}
.email-booking{display:flex;justify-content:space-between;gap:9px;border-top:1px solid #e8e2d9;border-bottom:1px solid #e8e2d9;padding:10px 0;margin-bottom:12px}
.email-booking strong{display:block;font-size:11px;color:#3b392f}.email-booking small{display:block;font-size:8px;color:#938577;margin-top:3px}
.email-demo-button{display:block;text-align:center;background:#3e4635;color:#fff;border-radius:5px;padding:9px;font-size:9px;font-weight:550}
.email-demo-foot{display:block;text-align:center;margin-top:8px;color:#9c907f;font-size:7px}
.email-demo-foot,.video-upload-meter,.video-preview-footer{line-height:1.3}
.extra-evidence-note{font-size:11px;line-height:1.6;color:#687996;margin:0 0 5px}
.service-example{padding:40px 0 18px}
.service-example h2{font-size:clamp(28px,4vw,45px);margin:13px 0 18px;letter-spacing:-1px}
.service-example-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(25px,5vw,90px);align-items:center}
.service-example .service-extra-preview{height:480px;padding:25px;container-type:inline-size}
.service-example .extra-toolbar{font-size:13px;margin-bottom:23px}.service-example .extra-toolbar>strong{font-size:11px}
.service-example .extra-window,.service-example .email-sheet{height:375px}
.service-example .extra-window-head{padding:15px 20px}.service-example .extra-window-head>strong{font-size:18px}.service-example .extra-view-chip{font-size:11px;padding:6px 10px}
.service-example .task-focus{padding:18px 20px}.service-example .task-focus>div>strong{font-size:24px}.service-example .task-focus>div>span{font-size:12px}.service-example .task-progress{width:55px;height:55px;font-size:13px;border-width:5px}
.service-example .task-preview-list{padding:0 20px}.service-example .task-preview-row{padding:17px 0;gap:13px}.service-example .task-preview-row strong{font-size:14px}.service-example .task-preview-row small,.service-example .task-preview-row>span{font-size:11px}.service-example .task-preview-row>i{width:17px;height:17px}.service-example .task-preview-bottom{padding:15px 20px;font-size:11px}
.service-example .video-queue{padding:20px;gap:17px}.service-example .video-thumbnail{width:65px;height:53px}.service-example .video-queue-row strong{font-size:14px}.service-example .video-queue-row small{font-size:11px}.service-example .video-state{font-size:10px;padding:6px 9px}
.service-example .video-upload-meter{padding:12px 20px 7px;font-size:11px}.service-example .video-upload-meter>strong{font-size:11px}.service-example .video-upload-track{margin:0 20px;height:5px}.service-example .video-preview-footer{margin:18px 20px 0;padding-top:12px;font-size:11px}
.service-example .email-sheet{padding:25px 30px}.service-example .email-mark{font-size:11px}.service-example .email-sheet h4{font-size:37px;margin:24px 0 12px}.service-example .email-sheet>p{font-size:12px}.service-example .email-booking{padding:16px 0;margin-bottom:17px}.service-example .email-booking strong{font-size:16px}.service-example .email-booking small{font-size:11px}.service-example .email-demo-button{padding:13px;font-size:13px}.service-example .email-demo-foot{font-size:10px;margin-top:10px}
.service-example-note>span{font-size:11px;color:#526480;letter-spacing:.1em}.service-example-note p{font-size:17px;line-height:1.7;color:#566581}.service-example-note a{display:inline-flex;align-items:center;min-height:44px;color:#244cff;font-size:15px;text-decoration:underline;text-underline-offset:5px;margin-right:18px}
/* Высота включает все детали интерфейса, в том числе нижние подписи. */
.service-extra-preview{height:350px}.extra-window,.email-sheet{height:284px}
.service-example .service-extra-preview{height:520px}.service-example .extra-window,.service-example .email-sheet{height:415px}
@media(min-width:761px) and (max-width:1100px){.service-extra-card>.service-extra-label{grid-column:2;grid-row:1}}
@media(max-width:760px){.service-extra-label{min-height:26px}.service-extra-preview{height:324px;padding:16px 13px}.service-example-layout{grid-template-columns:1fr;gap:20px}.service-example .service-extra-preview{height:386px;padding:15px}.service-example .extra-window,.service-example .email-sheet{height:309px}.service-example .extra-window-head{padding:12px}.service-example .extra-window-head>strong{font-size:14px}.service-example .extra-view-chip{font-size:9px}.service-example .task-focus{padding:13px}.service-example .task-focus>div>strong{font-size:21px}.service-example .task-focus>div>span{font-size:10px}.service-example .task-progress{width:44px;height:44px;font-size:11px}.service-example .task-preview-list{padding:0 13px}.service-example .task-preview-row{padding:14px 0;gap:10px}.service-example .task-preview-row strong{font-size:11px}.service-example .task-preview-row small,.service-example .task-preview-row>span{font-size:9px}.service-example .task-preview-bottom{padding:12px 13px;font-size:9px}.service-example .video-queue{padding:14px 12px;gap:13px}.service-example .video-thumbnail{width:49px;height:44px}.service-example .video-queue-row strong{font-size:11px}.service-example .video-queue-row small{font-size:9px}.service-example .video-state{font-size:8px;padding:5px}.service-example .video-upload-meter{padding:10px 12px 6px;font-size:9px}.service-example .video-upload-meter>strong{font-size:9px}.service-example .video-upload-track{margin:0 12px}.service-example .video-preview-footer{margin:13px 12px 0;padding-top:10px;font-size:9px}.service-example .email-sheet{padding:20px}.service-example .email-sheet h4{font-size:30px;margin:20px 0 12px}.service-example .email-mark{font-size:9px}.service-example .email-sheet>p{font-size:10px}.service-example .email-booking strong{font-size:13px}.service-example .email-booking small{font-size:9px}.service-example .email-demo-button{padding:11px;font-size:11px}.service-example .email-demo-foot{font-size:8px}.service-example-note p{font-size:15px}.service-example{padding-top:28px}}
@media(max-width:760px){.service-extra-preview{height:350px}.service-example .service-extra-preview{height:420px}.service-example .extra-window,.service-example .email-sheet{height:343px}}