/* PROLOM.TECH webfonts.
   Выбор гарнитуры (по ТЗ на корректировку): из шести кандидатов — Manrope,
   Plus Jakarta Sans, Space Grotesk, Sora, Inter, Geist — только Manrope и Inter
   имеют полное покрытие кириллицы. Plus Jakarta Sans, Space Grotesk, Sora и Geist
   кириллицу не поддерживают вовсе: русские заголовки на них подменяются системным
   шрифтом. Поэтому берём Manrope — заявленное «мощный, дорогой, современный»
   совпадает с задачей, а ExtraBold 800 в верхнем регистре держит заголовки плотно
   и чётко. Inter оставлен как второй запасной. */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/2a59e652-7c87-47a3-96db-32bc062a1de0.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/20d1fee1-4869-49cc-9b4b-18cae318f8f3.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/33f11af0-f2b8-470d-9456-878731930c04.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/172fd3e2-84ae-4050-b834-c55132af10d6.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/82f41df7-3f18-460c-8318-2af20db971d8.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/824929ad-1045-4c87-8a06-344fb30e2866.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/2a59e652-7c87-47a3-96db-32bc062a1de0.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/20d1fee1-4869-49cc-9b4b-18cae318f8f3.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/33f11af0-f2b8-470d-9456-878731930c04.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/172fd3e2-84ae-4050-b834-c55132af10d6.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/82f41df7-3f18-460c-8318-2af20db971d8.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/824929ad-1045-4c87-8a06-344fb30e2866.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/2a59e652-7c87-47a3-96db-32bc062a1de0.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/20d1fee1-4869-49cc-9b4b-18cae318f8f3.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/33f11af0-f2b8-470d-9456-878731930c04.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/172fd3e2-84ae-4050-b834-c55132af10d6.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/82f41df7-3f18-460c-8318-2af20db971d8.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/824929ad-1045-4c87-8a06-344fb30e2866.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/7e64911a-acb8-410e-8b75-9630126efc3a.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/fae5d995-bbb2-4cb2-8f73-933cd4e41e66.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/e6013566-7ffb-496e-9276-eabeb22d3b3c.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/d5b4160c-7be5-445f-9922-f848ae1f18b9.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/261b9348-9222-4059-94d3-3e51dcb9a7aa.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/6c442374-f987-4202-8a9d-49d781a25fd8.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/7e64911a-acb8-410e-8b75-9630126efc3a.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/fae5d995-bbb2-4cb2-8f73-933cd4e41e66.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/e6013566-7ffb-496e-9276-eabeb22d3b3c.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/d5b4160c-7be5-445f-9922-f848ae1f18b9.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/261b9348-9222-4059-94d3-3e51dcb9a7aa.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/6c442374-f987-4202-8a9d-49d781a25fd8.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/7e64911a-acb8-410e-8b75-9630126efc3a.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/fae5d995-bbb2-4cb2-8f73-933cd4e41e66.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/e6013566-7ffb-496e-9276-eabeb22d3b3c.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/d5b4160c-7be5-445f-9922-f848ae1f18b9.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/261b9348-9222-4059-94d3-3e51dcb9a7aa.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/6c442374-f987-4202-8a9d-49d781a25fd8.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/7e64911a-acb8-410e-8b75-9630126efc3a.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/fae5d995-bbb2-4cb2-8f73-933cd4e41e66.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/e6013566-7ffb-496e-9276-eabeb22d3b3c.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/d5b4160c-7be5-445f-9922-f848ae1f18b9.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/261b9348-9222-4059-94d3-3e51dcb9a7aa.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/6c442374-f987-4202-8a9d-49d781a25fd8.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/7e64911a-acb8-410e-8b75-9630126efc3a.woff2") format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/fae5d995-bbb2-4cb2-8f73-933cd4e41e66.woff2") format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/e6013566-7ffb-496e-9276-eabeb22d3b3c.woff2") format('woff2');
  unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/d5b4160c-7be5-445f-9922-f848ae1f18b9.woff2") format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/261b9348-9222-4059-94d3-3e51dcb9a7aa.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("fonts/6c442374-f987-4202-8a9d-49d781a25fd8.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Palette: industrial steel + concrete + one hazard signal.
   Derived from the brief's colour reference (bottelierbv.nl — dark technical base,
   light concrete surfaces, single warm signal accent) and the "engineering, strict,
   corporate" tonality. No acid accents, no purple gradients. */
:root {
  /* --- base scales ------------------------------------------------------- */
  /* Graphite: the dark structural base. */
  --graphite-950: #0B0E10;
  --graphite-900: #12161A;
  --graphite-800: #1B2126;
  --graphite-700: #262E34;
  --graphite-600: #364149;
  --graphite-500: #4C585F;

  /* Steel: mid greys for borders, captions, disabled states. */
  --steel-400: #6E7780;
  --steel-300: #8E969D;
  --steel-200: #B6BCC1;
  --steel-100: #D6D9DB;

  /* Concrete: warm light surfaces. */
  --concrete-100: #E4E1DB;
  --concrete-050: #EFEDE8;
  --concrete-025: #F6F5F2;
  --white: #FFFFFF;

  /* Hazard: the single accent. Machinery yellow. */
  --hazard-600: #C99400;
  --hazard-500: #E8AE05;
  --hazard-400: #FFC10E;
  --hazard-300: #FFD35A;
  --hazard-100: #FFF2CE;

  /* Oxide: secondary accent, used only for the scrap-metal story. */
  --oxide-600: #8E3A18;
  --oxide-500: #B3491F;
  --oxide-100: #F6E3DB;

  /* --- semantic aliases -------------------------------------------------- */
  --text-strong: var(--graphite-950);
  --text-body: var(--graphite-700);
  --text-muted: var(--steel-400);
  --text-inverse: var(--concrete-025);
  --text-inverse-muted: var(--steel-300);
  --text-accent: var(--hazard-600);
  --text-link: var(--graphite-900);
  --text-link-hover: var(--hazard-600);

  --surface-page: var(--concrete-025);
  --surface-card: var(--white);
  --surface-sunken: var(--concrete-050);
  --surface-dark: var(--graphite-900);
  --surface-dark-raised: var(--graphite-800);
  --surface-accent: var(--hazard-400);
  --surface-accent-soft: var(--hazard-100);

  --border-hairline: #DCD9D3;
  --border-default: var(--concrete-100);
  --border-strong: var(--steel-200);
  --border-dark: var(--graphite-700);
  --border-accent: var(--hazard-400);

  --action-primary-bg: var(--hazard-400);
  --action-primary-bg-hover: var(--hazard-500);
  --action-primary-bg-active: var(--hazard-600);
  --action-primary-fg: var(--graphite-950);
  --action-secondary-bg: var(--graphite-900);
  --action-secondary-bg-hover: var(--graphite-800);
  --action-secondary-fg: var(--concrete-025);
  --action-ghost-border: var(--steel-200);
  --action-disabled-bg: var(--concrete-100);
  --action-disabled-fg: var(--steel-300);

  --focus-ring: var(--hazard-400);

  /* Status. Used for form validation and document states only. */
  --status-success: #3E7C4F;
  --status-success-soft: #E4EFE6;
  --status-warning: #C97A0A;
  --status-warning-soft: #FBEEDA;
  --status-danger: #B3311F;
  --status-danger-soft: #F8E4E1;
  --status-info: #2E5A78;
  --status-info-soft: #E3EDF3;

  /* Overlays: protection gradients over video and photography. */
  --scrim-bottom: linear-gradient(180deg, rgba(11,14,16,0) 0%, rgba(11,14,16,0.55) 55%, rgba(11,14,16,0.92) 100%); /* @kind color */
  --scrim-left: linear-gradient(90deg, rgba(11,14,16,0.92) 0%, rgba(11,14,16,0.6) 45%, rgba(11,14,16,0.15) 100%); /* @kind color */
  --glass-dark: rgba(18,22,26,0.72);
}

:root {
  --font-display: "Manrope", "Helvetica Neue", Arial, sans-serif;  /* заголовки, верхний регистр */
  --font-text: "Manrope", "Helvetica Neue", Arial, sans-serif;     /* body + UI */
  --font-mono: "JetBrains Mono", ui-monospace, monospace;  /* numbers, codes, requisites */

  /* Display scale — headlines only, always uppercase.
     Manrope шире Oswald, поэтому кегли уменьшены, а межстрочные увеличены:
     при 1.04 диакритика и выносные элементы налезали на строку выше. */
  --size-display-1: 70px;  --lh-display-1: 1.14; /* @kind font */
  --size-display-2: 54px;  --lh-display-2: 1.16; /* @kind font */
  --size-display-3: 38px;  --lh-display-3: 1.2; /* @kind font */
  --size-display-4: 27px;  --lh-display-4: 1.24; /* @kind font */

  /* Text scale. */
  --size-lead: 21px;   --lh-lead: 1.5; /* @kind font */
  --size-body: 17px;   --lh-body: 1.6; /* @kind font */
  --size-small: 15px;  --lh-small: 1.55; /* @kind font */
  --size-caption: 13px;--lh-caption: 1.45; /* @kind font */

  /* Overline / label — mono, uppercase, tracked out. */
  --size-label: 12px;  --lh-label: 1.2; /* @kind font */

  --weight-regular: 400; /* @kind font */
  --weight-medium: 500; /* @kind font */
  --weight-semibold: 600; /* @kind font */
  --weight-bold: 700; /* @kind font */
  --weight-black: 800; /* @kind font */

  --tracking-display: -0.02em; /* @kind font */
  --tracking-label: 0.14em; /* @kind font */
  --tracking-button: 0.06em; /* @kind font */
}

:root {
  /* 4px base step. Section rhythm is deliberately large: this is a widescreen,
     sparse, corporate layout. */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;

  --section-py: 120px;          /* desktop vertical section padding */
  --section-py-compact: 80px;
  --gutter: 48px;               /* page side gutter, desktop */
  --gutter-mobile: 20px;
  --content-max: 1560px;        /* widescreen container */
  --measure-max: 68ch; /* @kind other */          /* prose measure */
  --header-h: 76px;
}

:root {
  /* Near-square by intent. Machined edges, not app-store bubbles. */
  --radius-xs: 2px;
  --radius-sm: 3px;
  --radius-md: 4px;
  --radius-lg: 6px;
  --radius-pill: 999px;   /* floating contact button only */

  --border-w-hair: 1px; /* @kind spacing */
  --border-w-strong: 2px; /* @kind spacing */
  --rule-accent-w: 3px; /* @kind spacing */   /* the accent rule under section headings */
}

:root {
  /* Shadows are shallow and neutral-cool. Cards mostly rely on a hairline border;
     shadow appears on hover and on floating chrome. */
  --shadow-card: 0 1px 2px rgba(11,14,16,0.05);
  --shadow-card-hover: 0 10px 28px -12px rgba(11,14,16,0.22);
  --shadow-float: 0 12px 32px -10px rgba(11,14,16,0.4);
  --shadow-modal: 0 40px 80px -24px rgba(11,14,16,0.5);
}

:root {
  /* Movement is restricted by the brief: block reveals on scroll, state
     transitions, nothing else. No parallax, no counters, no shaders. */
  --dur-fast: 120ms; /* @kind other */
  --dur-base: 200ms; /* @kind other */
  --dur-slow: 320ms; /* @kind other */
  --ease-standard: cubic-bezier(0.2, 0, 0.2, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-fast: 0ms; /* @kind other */
    --dur-base: 0ms; /* @kind other */
    --dur-slow: 0ms; /* @kind other */
  }
}

*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  background: var(--surface-page);
  color: var(--text-body);
  font-family: var(--font-text);
  font-size: var(--size-body);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
  text-wrap: pretty;
}
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: var(--weight-black);
  color: var(--text-strong);
  text-transform: uppercase;
  letter-spacing: var(--tracking-display);
  margin: 0;
  text-wrap: balance;
}
h1 { font-size: var(--size-display-1); line-height: var(--lh-display-1); }
h2 { font-size: var(--size-display-2); line-height: var(--lh-display-2); }
h3 { font-size: var(--size-display-3); line-height: var(--lh-display-3); }
h4 { font-size: var(--size-display-4); line-height: var(--lh-display-4); }
p { margin: 0; }
a { color: var(--text-link); text-decoration: none; border-bottom: 1px solid var(--border-accent); transition: color var(--dur-base) var(--ease-standard); }
a:hover { color: var(--text-link-hover); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--focus-ring); outline-offset: 2px;
}
.pt-label {
  font-family: var(--font-mono);
  font-size: var(--size-label);
  line-height: var(--lh-label);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-muted);
}
.pt-mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
/* Переливающийся акцент для иконок в тёмной полосе доверия. */
@keyframes pt-sheen { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.pt-sheen { background-image: linear-gradient(100deg, var(--hazard-600) 20%, var(--hazard-300) 42%, var(--white) 50%, var(--hazard-300) 58%, var(--hazard-600) 80%); background-size: 200% 100%; animation: pt-sheen 5s linear infinite; }
@keyframes pt-rise { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .pt-sheen { animation: none; } }
.pt-container { max-width: var(--content-max); margin: 0 auto; padding-inline: var(--gutter); }
@media (max-width: 860px) {
  :root { --size-display-1: 40px; --size-display-2: 32px; --size-display-3: 26px; --size-display-4: 21px;
          --size-lead: 18px; --section-py: 64px; --section-py-compact: 48px; --gutter: var(--gutter-mobile); }
}

/* Адаптив лендинга. Правила навешиваются через data-m="…" на конкретные узлы,
   потому что вся вёрстка секций написана инлайн-стилями — отсюда !important.
   Десктоп ≥1025px не затрагивается ни одним правилом этого файла. */

/* ---------- Планшет ---------- */
@media (max-width: 1024px) {
  [data-m~="stack-lg"] { grid-template-columns: minmax(0, 1fr) !important; }
  [data-m~="c2-lg"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  [data-m~="c3-lg"] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

/* ---------- Телефон и крупный телефон ---------- */
@media (max-width: 860px) {
  html, body { overflow-x: hidden; }
  #root { overflow-x: clip; }

  /* Липкая нижняя панель не должна перекрывать конец страницы. */
  body { padding-bottom: 68px; }

  /* iOS зумит страницу при фокусе на поле мельче 16px. */
  #root input, #root textarea, #root select { font-size: 16px !important; }

  /* Ограничения по ch у заголовков и абзацев шире экрана телефона. */
  #root h1, #root h2, #root h3, #root h4, #root p { max-width: 100% !important; }
  /* Длинные подписи на кнопках переносятся вместо выхода за экран. */
  #root button, #root a { max-width: 100% !important; }
  #root button { white-space: normal !important; min-height: 44px; }

  [data-m~="stack"] { grid-template-columns: minmax(0, 1fr) !important; }
  [data-m~="c2"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  [data-m~="c3"] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  [data-m~="hide"] { display: none !important; }
  [data-m~="gap-sm"] { gap: var(--space-5) !important; }
  [data-m~="pad-sm"] { padding: var(--space-5) !important; }
  [data-m~="col"] { flex-direction: column !important; align-items: stretch !important; }
  [data-m~="center"] { justify-content: center !important; text-align: center; }

  /* Группы кнопок: во всю ширину, в столбик. */
  [data-m~="btns"] { display: flex !important; flex-direction: column; align-items: stretch !important; width: 100%; flex: 1 1 100%; gap: var(--space-3) !important; }
  [data-m~="btns"] > * { width: 100% !important; flex: 0 0 auto !important; justify-content: center !important; }

  /* Свайп-ленты: карточка чуть уже экрана, чтобы был виден край следующей. */
  [data-m~="rail"] { -webkit-mask-image: none !important; mask-image: none !important; scroll-padding-left: var(--gutter); }
  [data-m~="rail"] > * { flex: 0 0 82vw !important; }
  [data-m~="rail-narrow"] > * { flex: 0 0 74vw !important; }

  /* Плитки объектов: ниже, подпись всегда читается. */
  [data-m~="tile"] { min-height: 220px !important; }

  /* Горизонтально прокручиваемые табы. */
  [data-m~="tabs"] { flex-wrap: nowrap !important; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding-inline: var(--gutter); }
  [data-m~="tabs"] > * { flex: 0 0 auto; }

  /* Модалки — шторкой снизу. */
  [data-m~="sheet"] {
    align-items: flex-end !important;
    padding: 0 !important;
  }
  [data-m~="sheet"] > * {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 92vh !important;
    overflow-y: auto !important;
    border-radius: var(--radius-md) var(--radius-md) 0 0 !important;
    padding-bottom: calc(var(--space-6) + env(safe-area-inset-bottom)) !important;
  }
}

/* ---------- Узкий телефон ---------- */
@media (max-width: 600px) {
  /* Дисплейный шрифт узкий: длинные слова вроде «Профессиональный» не влезают в 375px. */
  :root { --size-display-1: 30px; --size-display-2: 26px; --size-display-3: 22px; --size-display-4: 19px; }
  #root { overflow-wrap: break-word; }

  [data-m~="stack-sm"] { grid-template-columns: minmax(0, 1fr) !important; }
  [data-m~="c2-sm"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  [data-m~="hide-sm"] { display: none !important; }
  [data-m~="rail"] > * { flex: 0 0 86vw !important; }
}

@media (max-width: 430px) {
  [data-m~="stack-xs"] { grid-template-columns: minmax(0, 1fr) !important; }
}


html{scroll-behavior:smooth}body{background:var(--surface-page)}[style*="overflow-x: auto"]::-webkit-scrollbar,div::-webkit-scrollbar{height:0}#root input,#root textarea,#root button,#root select{font-family:var(--font-text)}@keyframes pt-modal-pop{from{opacity:0;transform:translateY(18px) scale(.96)}to{opacity:1;transform:none}}@keyframes pt-sheen-sweep{0%{transform:translateX(-140%)}55%,100%{transform:translateX(260%)}}
/* Правки поверх комплекта дизайн-системы — свой файл, чтобы следующая
   заливка ui_kits/tokens ничего здесь не затёрла. */

/* Комплект переключает шапку на бургер с 860px, но десктопная шапка не
   помещается уже на 1024px: кнопка «Оставить заявку» уходит за край экрана.
   Порог поднят до 1024 в сборке — здесь то, что зависит от него в CSS:
   липкая нижняя панель не должна перекрывать конец страницы. */
@media (max-width: 1024px) {
  body { padding-bottom: 68px; }
}

/* Калькулятор «Как считается стоимость» приходит из дизайн-системы
   (CostCalculator в ds-bundle), и мобильных правил там нет: поля стоят в
   repeat(3,1fr) — по 68px на телефоне, а в итоговой строке
   minmax(0,1fr) minmax(0,1fr) auto кнопка съедает всю ширину и обе колонки
   схлопываются в 0px, отчего подписи печатаются по одной букве в столбик.
   Разворачиваем сетки калькулятора по ширине экрана. */
@media (max-width: 860px) {
  #calc [style*="display: grid"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 600px) {
  #calc [style*="display: grid"] { grid-template-columns: minmax(0, 1fr) !important; }
  /* кнопка расчёта и предупреждение о ставках — во всю ширину, без наезда */
  #calc [style*="display: grid"] > * { min-width: 0; }
}

@media (max-width: 860px) {
  /* Бейдж «Ставки — предварительные» набран с height: 26px — на телефоне
     подпись переносится на вторую строку и вылезает за плашку. */
  #calc [style*="height: 26px"] { height: auto !important; min-height: 26px; padding-block: 5px; }
  /* Итоговые цифры в 40 и 52px не помещаются в колонку телефона, когда в
     калькуляторе появляется настоящая сумма. */
  #calc [style*="font-size: 52px"] { font-size: 34px !important; line-height: 1.15 !important; }
  #calc [style*="font-size: 40px"] { font-size: 28px !important; line-height: 1.15 !important; }
}

/* Cookie-бар (fixed, z-index 60, max-width 460) на телефоне ложился ровно
   поверх липкой панели с кнопками «Позвонить» и «Оставить заявку» — до
   принятия cookie обе главные кнопки были недоступны. Поднимаем его над панелью. */
@media (max-width: 860px) {
  #root div[style*="z-index: 60"][style*="max-width: 460px"] {
    left: var(--space-4) !important;
    right: var(--space-4) !important;
    bottom: calc(76px + env(safe-area-inset-bottom)) !important;
    max-width: none !important;
  }
}