/*
 * Страницы модулей в новом дизайне (корень .mp) — /modules/<страница>/ по макетам GPT, первая — «Спецификации»
 * (24.10.2026). Перенос макета: pages/_tools/mockup_module_page.py — классы с приставкой mp-, область .mp, шрифты Protosender.
 * Ниже — стили макета как есть; в конце — то, что сайт меняет поверх них.
 * Подключается меткой страницы `_mtahub_layout_css` = module-page.css (mu-plugins/mtahub-front.php), скрипт —
 * module-page.js рядом.
 */
.mp{--mp-bg:#151a1d;--mp-panel:#1d2327;--mp-text:#f3f4f4;--mp-muted:#a8b1b7;--mp-copper:#dca071;--mp-brown:#965c39;--mp-line:rgba(255,255,255,.12);--mp-light:#f3f4f5;--mp-ink:#1b252c;--mp-body:#53616c}
.mp *{box-sizing:border-box}
.mp{margin:0;background:var(--mp-bg);font:400 16px/1.65 var(--t-text);color:var(--mp-text);-webkit-font-smoothing:antialiased}
.mp button,.mp a{-webkit-tap-highlight-color:transparent}
.mp a{color:inherit;text-decoration:none}
.mp button{font:inherit;color:inherit;cursor:pointer}
.mp button:disabled{cursor:default}
.mp button,.mp a{-webkit-tap-highlight-color:transparent}
.mp button:focus-visible,.mp a:focus-visible{outline:2px solid var(--mp-copper);outline-offset:5px}
.mp img{display:block;max-width:100%;height:auto}
.mp svg{display:block;flex:none}
.mp button{border:0;background:none}
.mp button[hidden],.mp [hidden]{display:none!important}
.mp .mp-wrap{width:min(1320px,calc(100% - 112px));margin-inline:auto}
.mp .mp-hero{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 94% 37%,rgba(139,85,48,.15),transparent 46%),linear-gradient(140deg,#171d21,#141a1d 65%)}
.mp .mp-hero:before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:82px 82px;mask-image:linear-gradient(90deg,transparent 15%,#000 95%)}
.mp .mp-hero:after{content:"";position:absolute;top:18%;right:-280px;width:800px;height:800px;border:1px solid rgba(220,160,113,.075);border-radius:50%;z-index:-1;box-shadow:0 0 0 70px rgba(220,160,113,.025),0 0 0 140px rgba(220,160,113,.018)}
.mp .mp-breadcrumbs{padding-top:26px;display:flex;align-items:center;gap:12px;font-size:var(--t-small);color:#87949d}
.mp .mp-breadcrumbs a{transition:color .2s}
.mp .mp-breadcrumbs a:hover{color:var(--mp-text)}
.mp .mp-breadcrumbs span:last-child{color:#c0c8cd}
.mp .mp-hero-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:58px;align-items:center;padding:48px 0 52px}
.mp h1{margin:22px 0 24px}
.mp h1>span{display:block;white-space:nowrap}
.mp h1 .mp-accent{color:var(--mp-copper)}
.mp .mp-hero-lead{max-width:430px;color:#b8c1c8;font-size:var(--t-lead);line-height:1.65;margin:0}
.mp .mp-hero-lead strong{color:#e9edef;font-weight:700}
.mp .mp-hero-actions{display:flex;align-items:center;gap:22px;margin-top:31px;flex-wrap:wrap}
.mp .mp-btn{display:inline-flex;align-items:center;justify-content:center;gap:15px;min-height:49px;padding:12px 22px;border-radius:6px;background:linear-gradient(110deg,#a46b45,#895030);border:1px solid #bb855d;color:#fff;font-size:var(--t-btn);font-weight:800;box-shadow:0 7px 25px #0002;transition:transform .2s,box-shadow .2s,background .2s}
.mp .mp-btn:hover{background:linear-gradient(110deg,#b67a51,#995b36);box-shadow:0 10px 32px #0003;transform:translateY(-2px)}
.mp .mp-text-link{display:inline-flex;align-items:center;gap:8px;font-size:var(--t-list);font-weight:700;color:#c5cdd2}
.mp .mp-text-link svg{color:var(--mp-copper)}
.mp .mp-text-link:hover{color:#fff}
.mp .mp-compatibility{display:flex;align-items:center;gap:9px;margin-top:29px;font-size:var(--t-small);color:#8e9ba5}
.mp .mp-compatibility span{color:#bec8cd}
.mp .mp-compatibility .mp-dot{height:3px;width:3px;background:#77848e;border-radius:50%;margin-inline:4px}
.mp .mp-showcase{min-width:0;position:relative}
.mp .mp-showcase:before{content:"";position:absolute;inset:10% -12% -5% -3%;z-index:-1;background:radial-gradient(ellipse,rgba(185,119,67,.13),transparent 66%);filter:blur(25px)}
.mp .mp-screen-shell{background:#1c2226;border:1px solid #3d4140;border-radius:11px;box-shadow:0 28px 72px rgba(0,0,0,.35),0 1px 0 #ffffff09 inset;overflow:hidden;position:relative}
.mp .mp-screen-shell:before{content:"";position:absolute;top:0;left:18%;right:18%;height:1px;background:linear-gradient(90deg,transparent,#d49b6c,transparent);animation:mp-edge-glow 5s ease-in-out infinite}
.mp .mp-screen-topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 19px;border-bottom:1px solid #ffffff0b}
.mp .mp-screen-title{display:flex;align-items:center;gap:10px;font-weight:700;font-size:var(--t-list)}
.mp .mp-screen-title svg{color:#d6a27c}
.mp .mp-screen-meta{font-size:var(--t-label);letter-spacing:.06em;text-transform:uppercase;color:#8f9ba3}
.mp .mp-screen-stage{width:100%;min-width:0;height:clamp(250px,24vw,338px);padding:13px 10px;display:flex;flex-direction:column;justify-content:center;background:#151a1d;cursor:zoom-in;position:relative;overflow:hidden}
.mp .mp-shot{width:100%;display:block}
.mp .mp-screen-panel{width:100%;min-width:0;display:flex;flex-direction:column;gap:8px;justify-content:center;min-height:100%}
.mp .mp-screen-panel.mp-active{animation:mp-screen-in .35s ease}
.mp .mp-screen-panel img{width:100%;object-fit:contain}
.mp .mp-zoom-hint{position:absolute;right:13px;bottom:12px;display:flex;align-items:center;gap:6px;border:1px solid #ffffff26;background:#12171be8;padding:6px 9px;border-radius:5px;font-size:var(--t-caption);color:#dce3e7;opacity:0;transition:opacity .2s}
.mp .mp-screen-stage:hover .mp-zoom-hint,.mp .mp-screen-stage:focus-visible .mp-zoom-hint{opacity:1}
.mp .mp-screen-tabs{display:flex;padding:0 17px;gap:20px;border-top:1px solid #ffffff0b}
.mp .mp-screen-tab{display:flex;align-items:center;gap:7px;padding:12px 2px;font-size:var(--t-small);color:#94a2ac;position:relative;white-space:nowrap}
.mp .mp-screen-tab span{font-size:var(--t-label);color:#687781}
.mp .mp-screen-tab[aria-selected="true"]{color:#e5b38b}
.mp .mp-screen-tab[aria-selected="true"]:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:#c59065}
.mp .mp-screen-tab[aria-selected="true"] span{color:#aa7b57}
.mp .mp-screen-tab:hover{color:#fff}
.mp .mp-screen-expand{margin-left:auto;padding:8px 0 8px 8px;color:#9ca9b2}
.mp .mp-screen-expand:hover{color:var(--mp-copper)}
.mp .mp-screen-caption{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:15px 2px 0}
.mp .mp-screen-caption p{font-size:var(--t-small);line-height:1.65;color:#9aa7af;margin:0;max-width:420px}
.mp .mp-screen-caption .mp-tag{flex:none;font-size:var(--t-label);color:#808f99;letter-spacing:.06em;text-transform:uppercase;padding-top:2px}
.mp .mp-process{display:grid;grid-template-columns:repeat(3,1fr);padding:27px 0 31px;border-top:1px solid var(--mp-line);gap:40px}
.mp .mp-process-item{display:flex;align-items:center;gap:18px;position:relative}
.mp .mp-process-num{font-size:var(--t-small);font-weight:700;color:#c89470;width:30px;height:30px;border-radius:50%;border:1px solid #aa7b554d;display:grid;place-items:center;background:#b0805010;flex:none}
.mp .mp-process-title{font-size:var(--t-body);line-height:1.4;font-weight:700;margin:0 0 5px}
.mp .mp-process p{font-size:var(--t-small);line-height:1.5;color:#8f9da6;margin:0}
.mp .mp-process-arrow{margin-left:auto;color:#7d695a;flex:none}
.mp dialog{border:1px solid #586068;border-radius:12px;background:#151a1d;color:#f4f5f6;width:min(1400px,94vw);max-width:94vw;max-height:92vh;padding:0;box-shadow:0 30px 120px #000b}
.mp dialog::backdrop{background:#070b10de;backdrop-filter:blur(8px)}
.mp .mp-dialog-head{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:17px 23px;border-bottom:1px solid #ffffff1a;position:sticky;top:0;background:#1d2429;z-index:2}
.mp .mp-dialog-title{font-size:var(--t-lead);font-weight:700;margin:0}
.mp .mp-dialog-close{display:flex;align-items:center;gap:8px;color:#bbc4cc;font-size:var(--t-small);padding:6px}
.mp .mp-dialog-close:hover{color:#fff}
.mp .mp-dialog-images{padding:16px;display:flex;flex-direction:column;gap:12px}
.mp .mp-dialog-images img{width:100%;height:auto}
.mp .mp-dialog-caption{padding:0 23px 19px;font-size:var(--t-small);line-height:1.6;color:#a9b3bc;margin:0}
.mp .mp-reveal{animation:mp-rise .7s cubic-bezier(.2,.65,.3,1) both}
.mp .mp-showcase.mp-reveal{animation-delay:.1s}
@keyframes mp-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes mp-screen-in{from{opacity:.25;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@keyframes mp-edge-glow{0%,100%{opacity:.45}50%{opacity:1}}
@media(min-width:1500px){
.mp .mp-hero-grid{padding-top:56px;padding-bottom:61px;gap:68px}
.mp .mp-hero-lead{font-size:var(--t-lead)}
.mp .mp-screen-stage{height:338px}
.mp .mp-hero-actions{gap:25px}
}
@media(max-width:1200px){
.mp .mp-wrap{width:calc(100% - 64px)}
.mp .mp-hero-grid{gap:34px;grid-template-columns:.9fr 1.1fr}
.mp .mp-hero-lead{font-size:var(--t-intro)}
.mp .mp-hero-actions{gap:15px}
.mp .mp-btn{padding-inline:17px;font-size:var(--t-btn)}
.mp .mp-text-link{font-size:var(--t-small)}
.mp .mp-compatibility{font-size:var(--t-caption)}
.mp .mp-screen-meta{font-size:var(--t-micro)}
.mp .mp-process{gap:22px}
}
@media(max-width:1020px){
.mp .mp-hero-grid{grid-template-columns:1fr 1fr;gap:28px}
.mp .mp-hero-actions{gap:16px;align-items:flex-start;flex-direction:column}
.mp .mp-compatibility{margin-top:22px}
.mp .mp-screen-stage{height:258px}
.mp .mp-screen-tabs{gap:13px;padding-inline:12px}
.mp .mp-screen-tab{font-size:var(--t-caption)}
.mp .mp-screen-caption .mp-tag{display:none}
.mp .mp-process{gap:22px}
.mp .mp-process-item{gap:12px}
.mp .mp-process-arrow{display:none}
}
@media(max-width:900px){
.mp .mp-wrap{width:calc(100% - 40px)}
.mp .mp-breadcrumbs{padding-top:21px;font-size:var(--t-caption)}
.mp .mp-hero-grid{display:flex;flex-direction:column;align-items:stretch;padding:35px 0 30px;gap:35px}
.mp .mp-hero-copy{max-width:560px}
.mp .mp-hero h1{margin:20px 0}
.mp .mp-hero-lead{max-width:480px;font-size:var(--t-intro);line-height:1.65}
.mp .mp-hero-actions{flex-direction:row;align-items:center;margin-top:25px;gap:20px}
.mp .mp-btn{font-size:var(--t-btn);min-height:46px}
.mp .mp-compatibility{font-size:var(--t-caption);margin-top:21px}
.mp .mp-screen-stage{height:auto;min-height:210px;aspect-ratio:1.97}
.mp .mp-screen-topbar{padding:13px 15px}
.mp .mp-screen-title{font-size:var(--t-small)}
.mp .mp-screen-meta{font-size:var(--t-micro)}
.mp .mp-screen-tabs{gap:19px;padding-inline:14px}
.mp .mp-screen-tab{font-size:var(--t-caption);padding-block:11px}
.mp .mp-screen-caption p{font-size:var(--t-caption)}
.mp .mp-screen-caption{padding-top:12px}
.mp .mp-screen-caption .mp-tag{display:block;font-size:var(--t-micro)}
.mp .mp-zoom-hint{opacity:1;font-size:var(--t-micro);right:9px;bottom:9px;padding:5px 7px}
.mp .mp-process{gap:18px;padding:24px 0 28px}
.mp .mp-process-item{display:block}
.mp .mp-process-num{width:25px;height:25px;font-size:var(--t-label);margin-bottom:10px}
.mp .mp-process-title{font-size:var(--t-small)}
.mp .mp-process p{font-size:var(--t-label)}
.mp .mp-dialog-head{padding:12px 14px}
.mp .mp-dialog-title{font-size:var(--t-list)}
.mp .mp-dialog-images{padding:6px}
.mp .mp-dialog-caption{font-size:var(--t-caption);padding:10px 14px 14px}
.mp .mp-dialog-close span{display:none}
}
@media(max-width:370px){
.mp .mp-wrap{width:calc(100% - 32px)}
.mp .mp-hero-actions{gap:14px}
.mp .mp-text-link{font-size:var(--t-caption)}
.mp .mp-btn{padding-inline:14px}
.mp .mp-screen-tab{font-size:var(--t-label)}
.mp .mp-screen-tabs{gap:12px}
.mp .mp-screen-caption .mp-tag{display:none}
.mp .mp-process{gap:12px}
.mp .mp-process-title{font-size:var(--t-caption)}
}
@media(prefers-reduced-motion:reduce){
.mp *,.mp *:before,.mp *:after{animation:none!important;transition:none!important}
}
.mp{--mp-section-space:78px;--mp-sticky-offset:142px}
.mp{overflow-x:clip}
.mp .mp-hero h1{margin-top:0}
.mp .mp-hero h1 .mp-h1-topic{display:block;font-size:var(--t-caption);font-weight:800;line-height:1.6;letter-spacing:.06em;color:var(--mp-copper);text-transform:uppercase;white-space:normal;margin-bottom:24px;font-family:var(--t-text)}
.mp .mp-hero h1 .mp-h1-topic:before{content:"";display:inline-block;width:22px;height:1px;background:var(--mp-copper);margin:0 10px 3px 0}
.mp .mp-hero-lead{max-width:450px}
.mp .mp-process-title{font-size:var(--t-body)}
.mp .mp-page-nav{position:sticky;top:78px;z-index:30;background:#f4f5f6f5;backdrop-filter:blur(12px);color:#52616b;border-bottom:1px solid #d9dfe3;box-shadow:0 4px 15px #10182005}
.mp .mp-page-nav-inner{display:flex;align-items:center;gap:31px;min-height:56px;white-space:nowrap}
.mp .mp-page-nav-inner>span{font-size:var(--t-small);font-weight:800;color:#25313a;margin-right:auto}
.mp .mp-page-nav a{font-size:var(--t-small);font-weight:700;line-height:56px;position:relative}
.mp .mp-page-nav a:hover,.mp .mp-page-nav a.mp-is-current{color:#925d3c}
.mp .mp-page-nav a.mp-is-current:after{content:"";height:2px;background:#a5724f;position:absolute;bottom:0;left:0;right:0}
.mp .mp-section{padding-block:var(--mp-section-space);scroll-margin-top:0}
.mp .mp-section.mp-light{background:#f3f4f5;color:#1b252c}
.mp .mp-section.mp-dark{background:#171e22;color:#f0f3f5}
.mp .mp-section h2{margin:0}
.mp .mp-kicker{font-size:var(--t-caption);font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#9a6746;margin:0 0 19px}
.mp .mp-dark .mp-kicker{color:#d5a27c}
.mp .mp-section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:55px;margin-bottom:36px}
.mp .mp-section-intro{font-size:var(--t-body);line-height:1.65;color:#626e77;max-width:405px;margin:0}
.mp .mp-section-intro p{margin:0}
.mp .mp-dark .mp-section-intro{color:#a8b5bf}
.mp .mp-example-label{display:flex;align-items:center;gap:10px;font-size:var(--t-caption);color:#71808a;margin-bottom:12px}
.mp .mp-example-label strong{font-weight:800;color:#596b77}
.mp .mp-example-dot{display:inline-block;flex:none;width:5px;height:5px;border-radius:50%;background:#ad7954}
.mp .mp-example-type{margin-left:auto;font-size:var(--t-label);letter-spacing:.06em;text-transform:uppercase}
.mp .mp-wide-figure{margin:0}
.mp .mp-zoom-link{display:block;position:relative;cursor:zoom-in;border-radius:9px;overflow:hidden;border:1px solid #303d44;background:#151a1d;box-shadow:0 12px 36px #17212a0d;transition:border-color .2s,box-shadow .2s}
.mp .mp-zoom-link:hover{border-color:#b38560;box-shadow:0 15px 38px #17212a1a}
.mp .mp-zoom-link>img{width:100%;height:auto}
.mp .mp-figure-zoom{display:flex;align-items:center;gap:6px;position:absolute;right:12px;bottom:12px;padding:7px 10px;border:1px solid #ffffff29;border-radius:5px;background:#1a2229e8;color:#e1e7eb;font-size:var(--t-caption);opacity:0;transition:opacity .2s;pointer-events:none}
.mp .mp-zoom-link:hover .mp-figure-zoom,.mp .mp-zoom-link:focus-visible .mp-figure-zoom{opacity:1}
.mp .mp-result-metrics{display:grid;grid-template-columns:repeat(4,1fr);margin:26px 0 0;padding:0 0 22px;border-bottom:1px solid #d9dfe3;gap:25px}
.mp .mp-result-metrics>div{border-left:1px solid #d9dfe3;padding-left:27px}
.mp .mp-result-metrics>div:first-child{border-left:0;padding-left:0}
.mp .mp-result-metrics dt{font-size:var(--t-small);color:#6b7982;margin-bottom:5px}
.mp .mp-result-metrics dd{margin:0;font-weight:800;line-height:1.3;font-size:31px;letter-spacing:-.03em;color:#24323d}
.mp .mp-result-metrics small{font-size:var(--t-small);font-weight:700;letter-spacing:0;color:#6f7c85}
.mp .mp-figure-note{font-size:var(--t-small);line-height:1.65;color:#79858d;margin:14px 0 0;max-width:none}
.mp .mp-modes-section{background:radial-gradient(ellipse at 90% 10%,#a56b3210,transparent 60%),#171e22!important}
.mp .mp-mode-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #ffffff20;margin-top:37px;gap:38px}
.mp .mp-plan-mode{position:relative;padding-top:28px}
.mp .mp-mode-number{font-size:var(--t-small);color:#b68a69;letter-spacing:.06em}
.mp .mp-plan-mode h3{font-size:var(--t-h3);margin:12px 0 4px;font-weight:800;letter-spacing:-.02em}
.mp .mp-plan-mode .mp-mode-subtitle{font-size:var(--t-caption);color:#ce9b74;letter-spacing:.01em;margin:0 0 15px}
.mp .mp-plan-mode p{font-size:var(--t-list);line-height:1.65;color:#9cabb6;margin:0 0 23px;max-width:340px}
.mp .mp-plan-mode a{font-size:var(--t-small);font-weight:700;display:inline-flex;align-items:center;gap:11px;color:#e1d2c7}
.mp .mp-plan-mode a svg{color:#c38f66;transition:transform .2s}
.mp .mp-plan-mode a:hover svg{transform:translateX(4px)}
.mp .mp-workflow-grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:48px;align-items:start}
.mp .mp-workflow-step{display:flex;align-items:flex-start;gap:14px;text-align:left;width:100%;padding:21px 0;border-top:1px solid #d8dfe3;color:#25343e;position:relative}
.mp .mp-workflow-step>.mp-step-index{font-size:var(--t-small);font-weight:700;color:#99a2a9;padding-top:2px}
.mp .mp-workflow-step>span:nth-child(2){flex:1}
.mp .mp-workflow-step strong{display:block;font-size:var(--t-intro);font-weight:800;line-height:1.6}
.mp .mp-workflow-step small{display:block;font-size:var(--t-small);line-height:1.65;margin-top:5px;color:#75828c;max-width:220px}
.mp .mp-workflow-step>svg{color:#a9b2b9;margin-top:4px;width:15px}
.mp .mp-workflow-step[aria-selected=true]{color:#8f5936;border-top-color:#b7835d}
.mp .mp-workflow-step[aria-selected=true]>.mp-step-index,.mp .mp-workflow-step[aria-selected=true]>svg{color:#ad7248}
.mp .mp-workflow-step[aria-selected=true]:before{content:"";position:absolute;top:-1px;left:0;width:48px;height:2px;background:#aa754e}
.mp .mp-workflow-step:hover{color:#8e5938}
.mp .mp-workflow-foot{margin-top:17px;padding:19px 21px;background:#e9edef;border-left:2px solid #ba997d;border-radius:0 6px 6px 0}
.mp .mp-workflow-foot>span{font-size:var(--t-caption);color:#8c6345;font-weight:800}
.mp .mp-workflow-foot p{font-size:var(--t-small);line-height:1.65;color:#6e7a84;margin:8px 0 0}
.mp .mp-workflow-view{min-width:0}
.mp .mp-workflow-view>.mp-example-label{min-height:24px}
.mp .mp-workflow-panel>p{font-size:var(--t-list);line-height:1.65;color:#586874;margin:17px 0 0;max-width:none}
.mp .mp-workflow-panel .mp-zoom-link{min-height:0}
.mp .mp-workflow-panel:not([hidden]){animation:mp-screen-in .3s ease}
.mp .mp-example-disclaimer{font-size:var(--t-caption);line-height:1.65;color:#879198;margin:16px 0 0;padding-top:15px;border-top:1px solid #d8dfe3}
.mp .mp-estimate-explainer{padding:29px 30px 24px;background:#e6ebee;border:1px solid #d5dde3;border-radius:8px;margin-bottom:17px}
.mp .mp-estimate-explainer>span{font-size:var(--t-caption);color:#7c664f;font-weight:800;letter-spacing:.06em}
.mp .mp-estimate-explainer>div{display:flex;align-items:center;gap:28px;margin-top:14px}
.mp .mp-estimate-explainer strong{font-size:31px;letter-spacing:-.03em;line-height:1.25}
.mp .mp-estimate-explainer small{font-size:var(--t-small);letter-spacing:0;font-weight:700}
.mp .mp-estimate-explainer svg{color:#b48664}
.mp .mp-estimate-explainer p{font-size:var(--t-small);line-height:1.65;color:#687983;margin:16px 0 0}
.mp .mp-method-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:35px 100px}
.mp .mp-method-intro>p:not(.mp-kicker){font-size:var(--t-body);line-height:1.65;color:#9aa9b3;max-width:370px;margin:23px 0}
.mp .mp-method-link{display:inline-flex;align-items:center;gap:10px;font-size:var(--t-small);font-weight:700;color:#d6ac8e}
.mp .mp-method-list article{display:flex;align-items:flex-start;gap:21px;padding:21px 0;border-top:1px solid #ffffff17}
.mp .mp-method-list article:first-child{padding-top:0;border-top:0}
.mp .mp-method-list article:last-child{padding-bottom:0}
.mp .mp-method-list article>span{font-size:var(--t-caption);color:#b38765;margin-top:3px}
.mp .mp-method-list h3{font-size:var(--t-h4);font-weight:800;line-height:1.22;margin:0 0 8px;letter-spacing:-.01em}
.mp .mp-method-list p{font-size:var(--t-list);line-height:1.65;color:#91a2ae;margin:0}
.mp .mp-method-note{grid-column:1/-1;display:flex;align-items:center;gap:16px;border-top:1px solid #ffffff17;padding-top:24px;margin-top:5px}
.mp .mp-method-note svg{color:#bc916e;flex:none}
.mp .mp-method-note p{font-size:var(--t-small);color:#9cabba;line-height:1.65;margin:0;max-width:none}
.mp .mp-interface-section .mp-section-heading{margin-bottom:47px}
.mp .mp-expand-all{display:flex;align-items:center;gap:16px;font-size:var(--t-small);font-weight:800;color:#8c5d3c;padding:0;margin-top:18px}
.mp .mp-expand-all span{font-size:20px;font-weight:400;line-height:1}
.mp .mp-interface-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:55px;align-items:start}
.mp .mp-interface-aside{position:sticky;top:165px}
.mp .mp-aside-label{font-size:var(--t-label);font-weight:800;color:#8a969d;letter-spacing:.06em;text-transform:uppercase}
.mp .mp-interface-aside nav{display:flex;flex-direction:column;margin-top:17px;gap:2px}
.mp .mp-interface-aside nav a{display:flex;align-items:center;gap:12px;font-size:var(--t-small);color:#687984;padding:11px 0;border-bottom:1px solid #dfe4e7}
.mp .mp-interface-aside nav a span{font-size:var(--t-label);color:#9b795f}
.mp .mp-interface-aside nav a:hover,.mp .mp-interface-aside nav a.mp-is-current{color:#9a6541}
.mp .mp-aside-tip{display:flex;align-items:flex-start;gap:11px;padding-top:24px;color:#9b765b}
.mp .mp-aside-tip p{margin:0;max-width:145px;font-size:var(--t-caption);line-height:1.65;color:#87939b}
.mp .mp-screen-group{scroll-margin-top:150px;margin:0 0 41px}
.mp .mp-screen-group:last-child{margin-bottom:0}
.mp .mp-group-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:9px}
.mp .mp-group-heading h3{font-size:var(--t-h3);font-weight:800;margin:0;color:#263742;letter-spacing:-.02em}
.mp .mp-group-heading>span{color:#909da5;font-size:var(--t-caption);white-space:nowrap}
.mp .mp-group-description{font-size:var(--t-list);line-height:1.65;color:#536671;max-width:none;margin:0 0 19px}
.mp .mp-screen-detail{border-top:1px solid #d5dde2;scroll-margin-top:150px}
.mp .mp-screen-detail:last-child{border-bottom:1px solid #d5dde2}
.mp .mp-screen-detail summary{display:flex;align-items:center;gap:14px;cursor:pointer;list-style:none;padding:18px 0}
.mp .mp-screen-detail summary::-webkit-details-marker{display:none}
.mp .mp-screen-detail .mp-screen-index{font-size:var(--t-caption);color:#9a7a61;flex:none;width:20px}
.mp .mp-screen-summary-text{flex:1}
.mp .mp-screen-detail h4{font-size:var(--t-h4);font-weight:800;line-height:1.33;margin:0;color:#2c3d49;letter-spacing:-.01em}
.mp .mp-screen-summary-text>span{display:block;font-size:var(--t-caption);line-height:1.6;color:#8b979f;margin-top:4px}
.mp .mp-detail-plus{position:relative;width:16px;height:16px;flex:none}
.mp .mp-detail-plus:before,.mp .mp-detail-plus:after{content:"";position:absolute;left:2px;right:2px;top:7px;height:1px;background:#9a7c64}
.mp .mp-detail-plus:after{transform:rotate(90deg);transition:transform .2s}
.mp .mp-screen-detail[open] .mp-detail-plus:after{transform:rotate(0)}
.mp .mp-screen-detail[open] summary h4{color:#8b5c3c}
.mp .mp-screen-detail[open] summary{padding-bottom:15px}
.mp .mp-screen-detail summary:hover h4{color:#8b5c3c}
.mp .mp-screen-body{padding-bottom:23px}
.mp .mp-screen-body>.mp-screen-intro{font-size:var(--t-list);line-height:1.65;color:#536671;margin:0 0 18px;max-width:none}
.mp .mp-screen-body figure{margin:0 0 19px}
.mp .mp-screen-body figcaption{font-size:var(--t-label);line-height:1.6;color:#8b979e;margin-top:8px}
.mp .mp-screen-body ul{padding-left:16px;margin:0;display:grid;gap:9px;font-size:var(--t-small);line-height:1.65;color:#5c707c}
.mp .mp-screen-body li::marker{color:#b4825d}
.mp .mp-screen-note{font-size:var(--t-caption);line-height:1.65;color:#7c898f;margin:16px 0 0;padding:12px 15px;border-left:2px solid #bea38c;background:#e9edef;border-radius:0 4px 4px 0}
.mp .mp-screen-detail:target summary{background:linear-gradient(90deg,#c6987020,transparent);padding-left:10px;padding-right:10px}
.mp .mp-screen-detail summary:focus-visible,.mp .mp-faq-item summary:focus-visible{outline:2px solid #ad7952;outline-offset:4px}
.mp .mp-faq-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px;align-items:start}
.mp .mp-faq-intro{font-size:var(--t-body);line-height:1.65;color:#91a2ae;max-width:320px;margin:23px 0 0}
.mp .mp-faq-item{border-bottom:1px solid #ffffff17}
.mp .mp-faq-item:first-child{border-top:1px solid #ffffff17}
.mp .mp-faq-item summary{list-style:none;display:flex;gap:20px;align-items:center;padding:19px 0;font-size:var(--t-faq);line-height:1.6;color:#c5d0d7;font-weight:700;cursor:pointer}
.mp .mp-faq-item summary::-webkit-details-marker{display:none}
.mp .mp-faq-item summary span:first-child{flex:1}
.mp .mp-faq-item[open] summary{color:#e0b797}
.mp .mp-faq-item[open] .mp-detail-plus:after{transform:rotate(0)}
.mp .mp-faq-item p{margin:0 0 23px;font-size:var(--t-list);line-height:1.65;color:#94a5b1;max-width:640px}
.mp .mp-faq-item summary:hover{color:#e0b797}
.mp .mp-next-grid{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:90px}
.mp .mp-next-grid>div:first-child>p:not(.mp-kicker){font-size:var(--t-body);line-height:1.65;color:#667985;max-width:none;margin:23px 0 28px}
.mp .mp-next-actions{display:flex;align-items:center;gap:26px;flex-wrap:wrap}
.mp .mp-plain-link{font-size:var(--t-small);font-weight:700;color:#8d5f3f;display:inline-flex;gap:8px;align-items:center}
.mp .mp-next-route{padding:25px 29px;border-radius:10px;border:1px solid #dce1e5;background:#eceff1}
.mp .mp-route-node{display:flex;align-items:center;gap:16px}
.mp .mp-route-node>span{width:32px;height:32px;border:1px solid #d2b396;border-radius:6px;color:#8b613d;display:grid;place-items:center;font-size:var(--t-caption);flex:none;background:#b58a5d13}
.mp .mp-route-node>div{flex:1}
.mp .mp-route-node strong{display:block;font-size:var(--t-body);font-weight:700;line-height:1.6;color:#2b414d}
.mp .mp-route-node small{display:block;font-size:var(--t-label);line-height:1.65;color:#88949c;margin-top:2px}
.mp .mp-route-node i{font-size:var(--t-intro);font-style:normal;color:#799082}
.mp .mp-route-node>svg{color:#b78a65}
.mp .mp-route-connector{height:23px;border-left:1px dashed #b7a18b;margin:5px 0 5px 16px}
.mp .mp-route-connector.mp-muted{border-color:#c4cdd3}
.mp .mp-route-node.mp-last>span{border-color:#c9d2d8;color:#8b9aa3;background:none}
.mp .mp-route-node.mp-last strong{color:#70838e}
.mp .mp-dialog-images img{min-width:0}
@media(min-width:1500px){
.mp{--mp-section-space:86px}
.mp .mp-workflow-grid{grid-template-columns:320px minmax(0,1fr);gap:55px}
}
@media(max-width:1200px){
.mp{--mp-section-space:65px}
.mp .mp-page-nav-inner{gap:22px}
.mp .mp-section-heading{gap:40px}
.mp .mp-section-intro{max-width:360px}
.mp .mp-workflow-grid{grid-template-columns:270px minmax(0,1fr);gap:31px}
.mp .mp-method-grid{gap:33px 65px}
.mp .mp-interface-layout{grid-template-columns:190px minmax(0,1fr);gap:36px}
.mp .mp-faq-layout,.mp .mp-next-grid{gap:55px}
.mp .mp-result-metrics dd{font-size:28px}
.mp .mp-result-metrics>div{padding-left:22px}
}
@media(max-width:1020px){
.mp .mp-page-nav-inner{gap:22px;overflow-x:auto;scrollbar-width:none}
.mp .mp-page-nav-inner::-webkit-scrollbar{display:none}
.mp .mp-page-nav-inner>span{margin-right:6px}
.mp .mp-page-nav a{font-size:var(--t-caption)}
.mp .mp-section-intro{max-width:330px;font-size:var(--t-list)}
.mp .mp-mode-grid{gap:25px}
.mp .mp-plan-mode h3{font-size:var(--t-h3);letter-spacing:-.02em}
.mp .mp-method-grid{gap:30px 45px}
.mp .mp-interface-layout{grid-template-columns:170px minmax(0,1fr);gap:30px}
.mp .mp-interface-aside nav a{font-size:var(--t-caption)}
.mp .mp-workflow-grid{grid-template-columns:230px minmax(0,1fr);gap:25px}
.mp .mp-workflow-step strong{font-size:var(--t-body)}
.mp .mp-workflow-step small{font-size:var(--t-caption)}
.mp .mp-estimate-explainer{padding:22px}
.mp .mp-estimate-explainer strong{font-size:24px}
.mp .mp-estimate-explainer>div{gap:15px}
.mp .mp-estimate-explainer small{display:block;margin-top:5px}
.mp .mp-faq-layout{grid-template-columns:.75fr 1.25fr;gap:40px}
.mp .mp-next-grid{gap:40px}
.mp .mp-next-route{padding:22px}
}
@media(max-width:900px){
.mp{--mp-sticky-offset:124px;--mp-section-space:56px}
.mp .mp-page-nav{top:67px}
.mp .mp-page-nav-inner{min-height:49px;gap:24px}
.mp .mp-page-nav-inner>span{display:none}
.mp .mp-page-nav a{line-height:49px}
.mp .mp-section-heading{align-items:flex-start;gap:30px}
.mp .mp-section-intro{max-width:310px}
.mp .mp-hero h1 .mp-h1-topic{font-size:var(--t-label);margin-bottom:20px;letter-spacing:.06em;font-family:var(--t-text)}
.mp .mp-mode-grid{gap:24px}
.mp .mp-plan-mode p{font-size:var(--t-small)}
.mp .mp-method-grid{grid-template-columns:1fr;gap:30px}
.mp .mp-method-intro{display:grid;grid-template-columns:1fr 1fr;gap:0 40px}
.mp .mp-method-intro .mp-kicker{grid-column:1/-1}
.mp .mp-method-intro>p:not(.mp-kicker){grid-column:2;grid-row:2;max-width:none;margin:0}
.mp .mp-method-intro .mp-method-link{grid-column:2;margin-top:15px}
.mp .mp-method-list{display:grid;grid-template-columns:1fr 1fr;gap:25px 35px}
.mp .mp-method-list article,.mp .mp-method-list article:first-child{padding:18px 0 0;border-top:1px solid #ffffff17}
.mp .mp-method-note{margin:0}
.mp .mp-interface-layout{grid-template-columns:1fr;gap:28px}
.mp .mp-interface-aside{position:static}
.mp .mp-aside-label,.mp .mp-aside-tip{display:none}
.mp .mp-interface-aside nav{flex-direction:row;flex-wrap:wrap;gap:8px 22px;margin:0;border-bottom:1px solid #d5dde2;padding-bottom:10px}
.mp .mp-interface-aside nav a{border:0;font-size:var(--t-caption);padding:5px 0}
.mp .mp-screen-group,.mp .mp-screen-detail{scroll-margin-top:130px}
.mp .mp-faq-layout{grid-template-columns:1fr;gap:30px}
.mp .mp-faq-layout>div:first-child{display:flex;flex-wrap:wrap;gap:0 50px}
.mp .mp-faq-layout .mp-kicker{width:100%}
.mp .mp-faq-intro{max-width:300px;margin-top:4px;font-size:var(--t-list)}
.mp .mp-next-grid{gap:30px}
.mp .mp-next-actions{gap:19px}
.mp .mp-next-route{padding:20px}
.mp .mp-next-route strong{font-size:var(--t-list)}
}
@media(max-width:700px){
.mp{--mp-section-space:45px}
.mp .mp-section-heading{display:block;margin-bottom:28px}
.mp .mp-kicker{font-size:var(--t-label);margin-bottom:15px}
.mp .mp-section-intro{font-size:var(--t-list);max-width:100%;margin-top:20px}
.mp .mp-example-label{font-size:var(--t-label);gap:7px;flex-wrap:wrap}
.mp .mp-example-type{display:none}
.mp .mp-result-metrics{grid-template-columns:repeat(2,1fr);gap:21px 30px;margin-top:21px;padding-bottom:19px}
.mp .mp-result-metrics>div{padding-left:0;border:0}
.mp .mp-result-metrics dd{font-size:27px}
.mp .mp-result-metrics dt{font-size:var(--t-caption)}
.mp .mp-result-metrics small{font-size:var(--t-caption)}
.mp .mp-figure-note{font-size:var(--t-caption)}
.mp .mp-figure-zoom{opacity:1;font-size:var(--t-micro);right:7px;bottom:7px;padding:5px 6px}
.mp .mp-figure-zoom svg{width:12px;height:12px}
.mp .mp-mode-grid{grid-template-columns:1fr;gap:0;margin-top:26px}
.mp .mp-plan-mode{padding:22px 0;border-bottom:1px solid #ffffff18;display:grid;grid-template-columns:25px 1fr;gap:0 15px}
.mp .mp-mode-number{grid-row:1/3;padding-top:5px;font-size:var(--t-caption)}
.mp .mp-plan-mode h3{font-size:var(--t-h3);margin:0 0 4px;letter-spacing:-.02em}
.mp .mp-plan-mode .mp-mode-subtitle{font-size:var(--t-label);grid-column:2;margin:0 0 13px}
.mp .mp-plan-mode>p:not(.mp-mode-subtitle){grid-column:2;max-width:100%;margin:0 0 15px;font-size:var(--t-list)}
.mp .mp-plan-mode>a{grid-column:2;font-size:var(--t-caption)}
.mp .mp-plan-mode:last-child{border-bottom:0;padding-bottom:0}
.mp .mp-workflow-grid{grid-template-columns:1fr;gap:24px}
.mp .mp-workflow-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mp .mp-workflow-step{display:block;padding:14px 0}
.mp .mp-workflow-step>.mp-step-index{display:block;margin-bottom:7px}
.mp .mp-workflow-step strong{font-size:var(--t-small);line-height:1.5}
.mp .mp-workflow-step small{font-size:var(--t-label);line-height:1.6}
.mp .mp-workflow-step>svg{display:none}
.mp .mp-workflow-foot{display:none}
.mp .mp-workflow-panel>p{font-size:var(--t-small)}
.mp .mp-example-disclaimer{font-size:var(--t-label)}
.mp .mp-estimate-explainer{padding:21px}
.mp .mp-estimate-explainer>div{justify-content:space-between;gap:10px}
.mp .mp-estimate-explainer strong{font-size:28px}
.mp .mp-estimate-explainer small{font-size:var(--t-label)}
.mp .mp-estimate-explainer p{font-size:var(--t-caption)}
.mp .mp-method-intro{display:block}
.mp .mp-method-intro>p:not(.mp-kicker){margin-top:20px;font-size:var(--t-list);max-width:100%}
.mp .mp-method-intro .mp-method-link{margin-top:4px;font-size:var(--t-caption)}
.mp .mp-method-list{grid-template-columns:1fr;gap:0}
.mp .mp-method-list article,.mp .mp-method-list article:first-child{padding:20px 0;gap:16px}
.mp .mp-method-list article:last-child{padding-bottom:0}
.mp .mp-method-list p{font-size:var(--t-small)}
.mp .mp-method-list h3{font-size:var(--t-h4);letter-spacing:-.01em}
.mp .mp-method-note{align-items:flex-start;padding-top:21px}
.mp .mp-method-note p{font-size:var(--t-caption)}
.mp .mp-interface-section .mp-section-heading{margin-bottom:22px}
.mp .mp-expand-all{font-size:var(--t-caption);margin-top:15px}
.mp .mp-interface-aside nav{display:grid;grid-template-columns:1fr 1fr;gap:5px 15px}
.mp .mp-interface-aside nav a{font-size:var(--t-label);gap:8px}
.mp .mp-group-heading h3{font-size:var(--t-h3s);letter-spacing:-.01em}
.mp .mp-group-heading{gap:12px;align-items:flex-start}
.mp .mp-group-heading>span{font-size:var(--t-label);padding-top:4px}
.mp .mp-group-description{font-size:var(--t-list);margin-bottom:15px}
.mp .mp-screen-group{margin-bottom:31px}
.mp .mp-screen-detail summary{gap:9px;padding:16px 0}
.mp .mp-screen-detail .mp-screen-index{font-size:var(--t-label);width:19px}
.mp .mp-screen-detail h4{font-size:var(--t-h4);letter-spacing:-.01em}
.mp .mp-screen-summary-text>span{font-size:var(--t-label)}
.mp .mp-screen-body>.mp-screen-intro{font-size:var(--t-small)}
.mp .mp-screen-body ul{font-size:var(--t-caption);gap:8px}
.mp .mp-screen-note{font-size:var(--t-label)}
.mp .mp-screen-body figcaption{font-size:var(--t-micro)}
.mp .mp-screen-body{padding-bottom:19px}
.mp .mp-faq-layout>div:first-child{display:block}
.mp .mp-faq-intro{margin-top:18px;max-width:100%;font-size:var(--t-list)}
.mp .mp-faq-item summary{font-size:var(--t-faq);padding:17px 0}
.mp .mp-faq-item p{font-size:var(--t-small)}
.mp .mp-next-grid{grid-template-columns:1fr;gap:30px}
.mp .mp-next-grid>div:first-child>p:not(.mp-kicker){font-size:var(--t-list);margin:20px 0 23px}
.mp .mp-next-actions{gap:18px}
.mp .mp-next-actions .mp-btn{font-size:var(--t-btn);padding-inline:14px}
.mp .mp-plain-link{font-size:var(--t-caption)}
.mp .mp-next-route{max-width:450px;padding:23px 27px}
}
@media(prefers-reduced-motion:reduce){
.mp .mp-workflow-panel:not([hidden]){animation:none}
}
.mp .mp-screen-group,.mp .mp-screen-detail{scroll-margin-top:0}
.mp .mp-section-heading{display:block;margin-bottom:35px}
.mp .mp-section-heading .mp-section-intro{max-width:none;margin-top:18px}
.mp .mp-section-heading .mp-section-intro p{max-width:none}
.mp .mp-method-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px 76px;align-items:start}
.mp .mp-method-intro{display:block}
.mp .mp-method-intro>p:not(.mp-kicker){max-width:460px;margin:0 0 18px;font-size:var(--t-intro)}
.mp .mp-method-intro .mp-method-link{margin-top:0}
.mp .mp-section-illustration{margin-top:28px;width:100%}
.mp .mp-section-art{display:block;width:100%;height:auto;overflow:visible;font-family:var(--t-text)}
.mp .mp-method-art{max-width:520px}
.mp .mp-art-trace path{stroke-dasharray:6 94;stroke-dashoffset:100;animation:mp-calculation-flow 6s linear infinite}
.mp .mp-art-trace path:nth-child(2){animation-delay:-1s}
.mp .mp-art-trace path:nth-child(3){animation-delay:-2s}
.mp .mp-art-trace path:nth-child(4){animation-delay:-3s}
@keyframes mp-calculation-flow{to{stroke-dashoffset:-100}}
.mp .mp-faq-layout{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:76px}
.mp .mp-faq-layout .mp-faq-visual{display:block}
.mp .mp-faq-intro{max-width:410px;margin:0;font-size:var(--t-intro)}
.mp .mp-launch-art{max-width:520px}
.mp .mp-faq-visual .mp-section-illustration{margin-top:24px}
.mp .mp-next-grid{gap:70px;align-items:start}
.mp .mp-next-grid>div:first-child>p:not(.mp-kicker){margin:0 0 25px}
.mp .mp-interface-section .mp-section-heading .mp-section-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;max-width:none}
.mp .mp-interface-section .mp-section-intro p{max-width:none}
.mp .mp-expand-all{margin:0;white-space:nowrap}
@media(min-width:901px){
.mp .mp-section h2{white-space:nowrap}
}
@media(max-width:1200px){
.mp .mp-method-grid,.mp .mp-faq-layout{gap:30px 50px}
.mp .mp-next-grid{gap:40px}
}
@media(max-width:900px){
.mp .mp-section-heading .mp-section-intro{max-width:none}
.mp .mp-method-grid,.mp .mp-faq-layout{grid-template-columns:minmax(0,1fr);gap:30px}
.mp .mp-method-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 30px;align-items:start}
.mp .mp-method-intro>p:not(.mp-kicker){grid-column:1;grid-row:1}
.mp .mp-method-intro .mp-method-link{grid-column:1;grid-row:2;align-self:start}
.mp .mp-method-intro .mp-section-illustration{grid-column:2;grid-row:1/3;margin:0}
.mp .mp-method-list{display:grid;grid-template-columns:1fr 1fr;gap:24px 30px}
.mp .mp-method-list article:first-child{padding-top:18px;border-top:1px solid #ffffff17}
.mp .mp-faq-layout>div.mp-faq-visual{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:30px}
.mp .mp-faq-visual .mp-section-illustration{margin:0}
.mp .mp-method-intro>p:not(.mp-kicker),.mp .mp-faq-intro{font-size:var(--t-body)}
.mp .mp-method-intro .mp-method-link{margin-top:0}
.mp .mp-section-illustration{margin-top:24px}
.mp .mp-interface-section .mp-section-heading .mp-section-intro{align-items:flex-start;gap:20px}
.mp .mp-interface-section .mp-section-intro p{max-width:none}
}
@media(max-width:700px){
.mp .mp-section h2{white-space:normal}
.mp .mp-section-heading,.mp .mp-interface-section .mp-section-heading{margin-bottom:28px}
.mp .mp-section-heading .mp-section-intro{max-width:none;margin-top:18px}
.mp .mp-method-grid,.mp .mp-faq-layout{grid-template-columns:minmax(0,1fr);gap:27px}
.mp .mp-method-intro,.mp .mp-faq-layout>div.mp-faq-visual{display:block}
.mp .mp-method-list{grid-template-columns:1fr;gap:0}
.mp .mp-method-intro>p:not(.mp-kicker){margin:0 0 16px}
.mp .mp-method-link{font-size:var(--t-small)}
.mp .mp-section-illustration{max-width:470px;margin:23px auto 0}
.mp .mp-method-intro .mp-section-illustration{margin:23px auto 0}
.mp .mp-method-list article:first-child{padding-top:20px;border-top:1px solid #ffffff17}
.mp .mp-faq-intro{margin:0;max-width:100%}
.mp .mp-faq-visual .mp-section-illustration{margin-top:20px}
.mp .mp-interface-section .mp-section-heading .mp-section-intro{display:block}
.mp .mp-expand-all{margin-top:18px}
.mp .mp-next-grid{gap:28px}
.mp .mp-next-grid>div:first-child>p:not(.mp-kicker){margin:0 0 24px}
}
@media(prefers-reduced-motion:reduce){
.mp .mp-art-trace path{animation:none;stroke-dasharray:none;opacity:.15}
}
.mp .mp-section-intro{font-size:var(--t-intro)}
.mp .mp-plan-mode p,.mp .mp-method-list p,.mp .mp-workflow-panel>p,.mp .mp-faq-item p{font-size:var(--t-body)}
.mp .mp-screen-body>.mp-screen-intro{font-size:var(--t-body)}
.mp .mp-screen-body ul{font-size:var(--t-list)}
.mp .mp-screen-note{font-size:var(--t-small)}
.mp .mp-next-grid>div:first-child>p:not(.mp-kicker){font-size:var(--t-intro)}
@media(max-width:700px){
.mp .mp-section-intro,.mp .mp-plan-mode>p:not(.mp-mode-subtitle),.mp .mp-method-list p,.mp .mp-workflow-panel>p,.mp .mp-faq-item p,.mp .mp-screen-body>.mp-screen-intro,.mp .mp-next-grid>div:first-child>p:not(.mp-kicker){font-size:var(--t-body)}
.mp .mp-screen-body ul{font-size:var(--t-list)}
.mp .mp-screen-note{font-size:var(--t-small)}
.mp .mp-faq-item summary{font-size:var(--t-faq)}
}

/* ───────── Сайт поверх макета ───────── */

/* Шрифты и размеры — общий формат сайта (type.css: страница Protosender, решение Шелеста 24.10.2026): заголовки —
   Inter 800 с поджатой разрядкой, текст — Arial. H1 и H2 — роли --t-h1/--t-h2 целиком: из правил макета их
   типографику вырезает конвертер, он же переводит остальные размеры в роли. Тема пишет заголовки «С Заглавной»,
   кнопки — капителью, и красит заголовки своим цветом: здесь это снимается. */
.mp h1,.mp h2,.mp h3,.mp h4{font-family:var(--t-head);font-weight:800;text-transform:none;color:inherit}
.mp h1{font-size:var(--t-h1);line-height:1.07;letter-spacing:-.03em}
.mp h2{font-size:var(--t-h2);line-height:1.08;letter-spacing:-.03em}
.mp h3{line-height:1.22;letter-spacing:-.01em}
.mp h4{line-height:1.33;letter-spacing:-.01em}
.mp :is(p,li,dt,dd,small,strong,span,b,em,figcaption,summary){color:inherit}
.mp dt{text-transform:none;font-weight:400}
.mp button,.mp a{text-transform:none;font-variant:normal}
/* Тема задаёт всем button: justify-content:center, overflow:hidden, position:relative, z-index:1 и transition — кнопки-
   шаги (flex) разъезжались лесенкой по длине подписи, а линия над активным шагом (top:-1px) срезалась. Здесь —
   поведение браузера; свои значения у классов страницы сильнее и остаются. */
.mp button{justify-content:normal;overflow:visible;position:static;z-index:auto;transition:none}
.mp .mp-process-title{display:block}
/* Elementor обнуляет отступы у figure внутри виджета (`.elementor .elementor-widget:not(…) figure{margin:0}` — сильнее
   правила макета), и список под снимком прижимался к подписи «Экран NN · …». Отступ — у самого списка; .mp.mp —
   сильнее правила страницы (.mp.mp--install … ul{margin:0}). */
.mp.mp .mp-screen-body figure+ul{margin-top:19px}
/* «Перед запуском»: слева вступление и рисунок, справа вопросы — колонка вопросов длиннее, и под рисунком оставалась
   пустота (Шелест 26.10.2026: «сделай картинку больше… или блок с вопросами просто подними выше»). Вопросы начинаются
   вровень с рубрикой раздела (заголовок раздела — в левой колонке), рисунок — во всю ширину колонки, а левая колонка
   едет вместе с прокруткой раскрытых ответов. Раздел — по разметке (вопросы в .mp-faq-layout), а не по классу секции:
   у «Установки» его нет; рисунок «Спецификаций» — svg, у «Установки» — карточка пути узла. */
@media(min-width:901px){
  .mp.mp .mp-section:has(>.mp-wrap>.mp-faq-layout) .mp-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:76px;align-items:start}
  .mp.mp .mp-section:has(>.mp-wrap>.mp-faq-layout) .mp-faq-layout{display:contents}
  .mp.mp .mp-section:has(>.mp-wrap>.mp-faq-layout) .mp-section-heading{grid-column:1;grid-row:1}
  /* Заголовок раздела теперь в левой колонке: макет DNS держит H2 в одну строку (nowrap) — он вылезал на вопросы. */
  .mp.mp .mp-section:has(>.mp-wrap>.mp-faq-layout) .mp-section-heading h2{white-space:normal}
  .mp.mp .mp-section:has(>.mp-wrap>.mp-faq-layout) .mp-faq-visual{grid-column:1;grid-row:2;position:sticky;top:calc(var(--mp-sticky-offset) + 24px)}
  .mp.mp .mp-section:has(>.mp-wrap>.mp-faq-layout) .mp-faq-list{grid-column:2;grid-row:1/3}
  .mp.mp .mp-launch-art,.mp.mp .mp-faq-visual .mp-launch-map{max-width:none}
}
@media(min-width:901px) and (max-width:1200px){.mp.mp .mp-section:has(>.mp-wrap>.mp-faq-layout) .mp-wrap{column-gap:50px}}
.mp :is(.mp-process-num,.mp-step-index,.mp-screen-index,.mp-mode-number,.mp-result-metrics dd,.mp-estimate-explainer strong){font-variant-numeric:tabular-nums}

/* Значки из спрайта сайта: у его символов нет своих цветов — линия цветом текста. */
.mp .mp-i{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* Слово с латиницей через дефис не рвётся (обёртку ставит загрузчик wp_info_page.php). display:contents — обёртка не
   становится отдельным элементом во flex-строке (подпись, кнопка, ссылка со стрелкой), иначе вокруг слова вставал
   зазор flex вместо пробела; запрет переноса текст внутри наследует. */
.mp .ip-nw{display:contents;white-space:nowrap}

/* Шапка темы при прокрутке закреплена: 70px, а с 1200px и уже — мобильная, 91px. Оглавление страницы встаёт под
   ней; якоря не уходят под обе полосы — отступ у самих целей. Общий scroll-padding-top у html из main.css (под шапку)
   здесь снят: он складывался с этим отступом, и цель вставала на 70px ниже оглавления. */
html:has(.mp){scroll-padding-top:0}
/* Тема до 1200px делает #pxl-main прокручиваемым (`.elementor-page:not(.single-product) #pxl-main{overflow:hidden}`),
   и закреплённое оглавление прилипает к нему, а не к окну, — то есть уезжает. clip режет так же, но прокручиваемым блок
   не делает. Селектор сильнее темного: (1,2,1) против (1,2,0). */
body.mtahub-page #pxl-main:has(.mp){overflow:visible;overflow-x:clip}
.mp{--mp-header:70px;--mp-nav:57px;--mp-sticky-offset:calc(var(--mp-header) + var(--mp-nav))}
@media(max-width:1200px){.mp{--mp-header:91px}}
@media(max-width:900px){.mp{--mp-nav:50px}}
.mp .mp-page-nav{top:var(--mp-header)}
.mp .mp-interface-aside{top:calc(var(--mp-header) + 90px)}
.mp [id],.mp .mp-section,.mp .mp-screen-group,.mp .mp-screen-detail{scroll-margin-top:var(--mp-sticky-offset)}
