/* ═══════════════════════════════════════════════════════════
   ООО «Перспектива Дез» — стили сайта-визитки
   Шрифты: Unbounded, Onest, JetBrains Mono — подключены с Google Fonts
   Палитра выведена из логотипа: сталь, янтарь, кислотная зелень
   ═══════════════════════════════════════════════════════════ */

/* ── 0. ШРИФТЫ (локальные, Google Fonts не нужен) ─────────── */
/* ── 0. ШРИФТЫ (локальные, Google Fonts не нужен) ─────────── */
@font-face{
  font-family:"Unbounded"; font-style:normal; font-weight:500; font-display:swap;
  src:url("../fonts/unbounded-latin-500-normal.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:"Unbounded"; font-style:normal; font-weight:500; font-display:swap;
  src:url("../fonts/unbounded-cyrillic-500-normal.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Unbounded"; font-style:normal; font-weight:600; font-display:swap;
  src:url("../fonts/unbounded-latin-600-normal.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:"Unbounded"; font-style:normal; font-weight:600; font-display:swap;
  src:url("../fonts/unbounded-cyrillic-600-normal.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Onest"; font-style:normal; font-weight:400; font-display:swap;
  src:url("../fonts/onest-latin-400-normal.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:"Onest"; font-style:normal; font-weight:400; font-display:swap;
  src:url("../fonts/onest-cyrillic-400-normal.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Onest"; font-style:normal; font-weight:500; font-display:swap;
  src:url("../fonts/onest-latin-500-normal.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:"Onest"; font-style:normal; font-weight:500; font-display:swap;
  src:url("../fonts/onest-cyrillic-500-normal.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:"Onest"; font-style:normal; font-weight:600; font-display:swap;
  src:url("../fonts/onest-latin-600-normal.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:"Onest"; font-style:normal; font-weight:600; font-display:swap;
  src:url("../fonts/onest-cyrillic-600-normal.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/jetbrains-mono-latin-400-normal.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:400; font-display:swap;
  src:url("../fonts/jetbrains-mono-cyrillic-400-normal.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* ── 1. ТОКЕНЫ ─────────────────────────────────────────────── */
:root{
  --paper:      #F4F6F6;
  --white:      #FFFFFF;
  --steel:      #E7ECEC;
  --line:       #D2DADC;
  --line-soft:  #E4EAEA;

  --graphite:   #16242B;
  --graphite-2: #1E2E36;
  --graphite-3: #2A3B44;

  --amber:      #F59012;
  --amber-lite: #FFAA00;
  --amber-deep: #A85607;
  --lime:       #5C840D;
  --lime-lite:  #A8D93F;

  --ink:        #16242B;
  --ink-soft:   #4F6069;
  --ink-mute:   #7B8B92;
  --danger:     #B3341F;

  --radius:     14px;
  --radius-sm:  10px;
  --maxw:       1180px;
  --pad:        clamp(18px, 5vw, 44px);
  --sec-y:      clamp(44px, 6vw, 76px);
  --head-gap:   clamp(18px, 2.2vw, 28px);

  --shadow:     0 1px 2px rgba(22,36,43,.06), 0 10px 28px rgba(22,36,43,.07);
  --shadow-lift:0 2px 6px rgba(22,36,43,.08), 0 20px 44px rgba(22,36,43,.13);
}

/* ── 2. БАЗА ───────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:88px; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Onest", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size:17px; line-height:1.62;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img,svg{ max-width:100%; }
img{ height:auto; display:block; }
picture{ display:block; }

a{ color:var(--amber-deep); text-decoration:none; }
a:hover{ color:var(--graphite); }

h1,h2,h3,h4{
  font-family:"Unbounded","Onest",sans-serif; font-weight:600;
  letter-spacing:-.03em; line-height:1.12; margin:0;
  overflow-wrap:break-word;
}
h1{ font-size:clamp(28px, 4.4vw, 54px); }
h2{ font-size:clamp(23px, 3.2vw, 40px); }
h3{ font-size:19px; letter-spacing:-.02em; line-height:1.28; }
h4{ font-size:14px; letter-spacing:.01em; }
p{ margin:0; }
ul,ol,dl,dd{ margin:0; padding:0; }
li{ list-style:none; }

:focus-visible{ outline:2px solid var(--amber); outline-offset:3px; border-radius:4px; }

.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }

.skip{ position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--amber); color:var(--graphite); padding:12px 18px; border-radius:0 0 8px 0; }
.skip:focus{ left:0; }

.eyebrow{
  font-family:"JetBrains Mono", ui-monospace, monospace;
  font-size:11.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--amber-deep); margin-bottom:10px;
}
.eyebrow--light{ color:var(--amber-lite); }

.sec__h{ margin-bottom:var(--head-gap); max-width:20ch; }
.lead{ color:var(--ink-soft); font-size:clamp(16px,1.4vw,18px); }

/* ── 3. КНОПКИ ─────────────────────────────────────────────── */
.btn{
  --bg:var(--amber);
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:15px 26px; background:var(--bg); color:var(--graphite);
  border:1px solid var(--bg); border-radius:100px;
  font-family:"Onest",sans-serif; font-size:16px; font-weight:600;
  cursor:pointer; text-align:center;
  transition:background .18s, border-color .18s, transform .18s, box-shadow .18s;
}
.btn:hover{ --bg:var(--amber-lite); color:var(--graphite); transform:translateY(-1px); box-shadow:var(--shadow); }
.btn:active{ transform:none; }

.btn--dark{ background:transparent; color:#fff; border-color:rgba(255,255,255,.4); }
.btn--dark:hover{ background:rgba(255,255,255,.12); color:#fff; border-color:#fff; }

.btn--ghost{ background:transparent; color:var(--graphite); border-color:var(--line); }
.btn--ghost:hover{ background:var(--white); color:var(--graphite); border-color:var(--amber); box-shadow:inset 0 0 0 1px var(--amber); }

.btn--sm{ padding:11px 20px; font-size:15px; }
.btn--wide{ width:100%; padding:17px 26px; }

/* ── 4. ШАПКА ──────────────────────────────────────────────── */
.top{
  position:sticky; top:0; z-index:100;
  background:rgba(22,36,43,.94);
  backdrop-filter:saturate(150%) blur(10px);
  border-bottom:1px solid rgba(255,255,255,.09);
}
.top__in{ display:flex; align-items:center; gap:clamp(12px,2.2vw,30px); min-height:76px; }

.brand{ display:flex; align-items:center; gap:11px; color:#fff; flex-shrink:0; min-width:0; }
.brand:hover{ color:#fff; }
.brand picture{ flex-shrink:0; }
.brand__mark{ width:50px; height:auto; }
.brand__text{ display:flex; flex-direction:column; min-width:0; }
.brand__name{ font-family:"Unbounded",sans-serif; font-weight:600; font-size:16px; letter-spacing:-.03em; line-height:1.15; }
.brand__sub{ font-family:"JetBrains Mono",monospace; font-size:9.5px; letter-spacing:.05em; color:rgba(255,255,255,.55); }

.nav{ display:flex; gap:clamp(10px,1.6vw,24px); margin-left:auto; }
.nav a{ color:rgba(255,255,255,.78); font-size:15px; font-weight:500; padding:6px 0; position:relative; white-space:nowrap; }
.nav a::after{ content:""; position:absolute; left:0; right:100%; bottom:0; height:2px; background:var(--amber); transition:right .22s; }
.nav a:hover{ color:#fff; }
.nav a:hover::after{ right:0; }

.top__cta{ display:flex; align-items:center; gap:14px; flex-shrink:0; }
.tel{ font-family:"JetBrains Mono",monospace; font-size:13.5px; color:#fff; white-space:nowrap; }
.tel:hover{ color:var(--amber-lite); }

.burger{ display:none; margin-left:auto; width:44px; height:44px;
  background:none; border:1px solid rgba(255,255,255,.28); border-radius:10px; cursor:pointer;
  flex-direction:column; align-items:center; justify-content:center; gap:5px; flex-shrink:0; }
.burger span{ display:block; width:19px; height:1.8px; background:#fff; border-radius:2px; transition:transform .2s, opacity .2s; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(6.8px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6.8px) rotate(-45deg); }

.mnav{ display:none; flex-direction:column; padding:6px var(--pad) 18px;
  border-top:1px solid rgba(255,255,255,.1); background:var(--graphite); }
.mnav[hidden]{ display:none; }
.mnav a{ padding:13px 0; color:#fff; font-size:17px; font-weight:500; border-bottom:1px solid rgba(255,255,255,.1); }
.mnav__tel{ font-family:"JetBrains Mono",monospace; color:var(--amber-lite) !important; border-bottom:none !important; }

.top__doc{ margin-left:auto; margin:5px}
.top__doc .btn--ghost{ color:#fff; border-color:rgba(255,255,255,.4); }
.top__doc .btn--ghost:hover{ background:rgba(255,255,255,.12); color:#fff; }

/* ── 5. ПЕРВЫЙ ЭКРАН ───────────────────────────────────────── */
.hero{ position:relative; isolation:isolate; background:var(--graphite);
  padding-block:clamp(34px,4.5vw,58px) clamp(40px,5vw,72px); color:#fff; }
.hero__bg{ position:absolute; inset:0; z-index:-2; }
.hero__bg img{ width:100%; height:100%; object-fit:cover; object-position:50% 42%; }
.hero::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(100deg, rgba(22,36,43,.94) 0%, rgba(22,36,43,.86) 46%, rgba(22,36,43,.5) 100%),
    linear-gradient(to bottom, rgba(22,36,43,.5), rgba(22,36,43,.2) 40%, var(--graphite) 100%);
}
.hero h1{ margin-bottom:20px; text-wrap:balance; }
.hero__lead{ color:rgba(255,255,255,.8); font-size:clamp(16px,1.5vw,19px); max-width:56ch; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }
.hero__in{ padding-bottom:clamp(40px,6vw,72px); }

.badges{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(228px,1fr));
  gap:1px; background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.16); border-radius:var(--radius);
  overflow:hidden; position:relative; z-index:2;
}
.badges li{ background:var(--graphite-2); padding:22px 24px; display:grid; gap:6px; }
.badges strong{ font-family:"Unbounded",sans-serif; font-weight:600; font-size:16px; letter-spacing:-.02em; }
.badges span{ font-size:14.5px; line-height:1.45; color:rgba(255,255,255,.66); }

/* ── 6. СЕКЦИИ ─────────────────────────────────────────────── */
.sec{ padding-block:var(--sec-y); }
.sec--steel{ background:var(--steel); }
.sec--dark{ background:var(--graphite); color:#fff; }
.sec--dark .lead{ color:rgba(255,255,255,.72); }


.ico{ width:34px; height:34px; fill:none; stroke:var(--amber);
  stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }

/* ── 7. УСЛУГИ ─────────────────────────────────────────────
   Оператор распыляет, туман тянется через всю секцию,
   услуги лежат прямо в нём. Никаких рамок и подложек.        */
#services{
  position:relative; overflow:hidden;
  background:linear-gradient(180deg,
    var(--paper) 0%, var(--steel) 14%, var(--steel) 74%, var(--paper) 100%);
}
#services::before{
  content:""; position:absolute; left:-10%; right:-6%; top:18%; height:82%;
  background:
    radial-gradient(46% 56% at 20% 58%, rgba(168,217,63,.42), transparent 70%),
    radial-gradient(44% 50% at 46% 44%, rgba(168,217,63,.26), transparent 72%),
    radial-gradient(48% 44% at 78% 54%, rgba(168,217,63,.15), transparent 74%);
  filter:blur(6px); pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 18%, #000 68%, transparent 100%);
          mask-image:linear-gradient(180deg, transparent 0%, #000 18%, #000 68%, transparent 100%);
}
#services .wrap{ position:relative; z-index:1; }

.svc{
  display:grid; grid-template-columns:minmax(0,.66fr) minmax(0,1.34fr);
  gap:clamp(20px,3vw,44px); align-items:stretch;
}

/* фигура прижата к нижней границе секции и заведомо выше своей колонки,
   поэтому пустоты над ней не остаётся */
.svc__fig{
  margin:0; position:relative; align-self:stretch;
  background:none; border-radius:0; min-height:340px; overflow:visible;
}
.svc__fig::before, .svc__fig::after{ content:none; }
.svc__fig picture{
  position:absolute; left:50%; bottom:calc(-0.28 * var(--sec-y));
  width:min(142%, 600px); transform:translateX(-50%);
}
.svc__fig img{ width:100%; }

.svc__list{ display:grid; align-content:start; gap:8px; min-width:0; }
.svc__list li{
  padding:15px 20px; border:none; border-radius:var(--radius-sm);
  background:rgba(255,255,255,.74); backdrop-filter:blur(3px);
  box-shadow:0 1px 2px rgba(22,36,43,.05);
  transition:background .2s ease, transform .2s ease;
}
.svc__list li:last-child{ border-bottom:none; }
/* услуги выстроены дугой — обтекают фигуру оператора */
.svc__list li:nth-child(2),
.svc__list li:nth-child(6){ margin-left:4%; }
.svc__list li:nth-child(3),
.svc__list li:nth-child(5){ margin-left:7%; }
.svc__list li:nth-child(4){ margin-left:8.5%; }
.svc__list li:hover{ background:#fff; transform:translateX(4px); margin-left:0; }
.svc__list h3{ margin-bottom:4px; overflow-wrap:break-word; hyphens:auto; }
.svc__list p{ color:var(--ink-soft); font-size:15.5px; line-height:1.5;
  overflow-wrap:break-word; hyphens:auto; }
.d-mob{ display:none; }        /* короткий текст — только для мобильных */

/* ── 8. МОЗАИКА ОБЪЕКТОВ ───────────────────────────────────── */
.mosaic{ display:grid; grid-template-columns:repeat(4,1fr);
  grid-auto-rows:clamp(158px,15.5vw,214px); gap:12px; }
.tile{
  position:relative; overflow:hidden; border-radius:var(--radius);
  height:100%; background:var(--graphite); isolation:isolate;
}
.tile--w{ grid-column:span 2; }
.tile--w img{ object-position:50% 50%; }
.tile img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 62%;
  transition:transform .45s ease; }
.tile::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(22,36,43,.92) 0%, rgba(22,36,43,.35) 48%, rgba(22,36,43,0) 78%);
}
.tile span{
  position:absolute; left:18px; right:18px; bottom:15px; z-index:2; color:#fff;
  font-family:"Unbounded",sans-serif; font-weight:600; font-size:15px;
  letter-spacing:-.02em; line-height:1.25; text-wrap:balance;
  overflow-wrap:break-word; hyphens:auto;
}
.tile:hover img{ transform:scale(1.05); }

/* ── 9. ПРЕИМУЩЕСТВА ───────────────────────────────────────── */
.bens{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:9px; }
.ben{
  background:var(--graphite-2); border:1px solid rgba(255,255,255,.09);
  border-radius:var(--radius); padding:13px 14px 15px; min-width:0;
  display:grid; grid-template-columns:auto minmax(0,1fr);
  column-gap:11px; row-gap:0; align-items:center;
  transition:border-color .2s, background .2s;
}
.ben:hover{ border-color:var(--amber); background:var(--graphite-3); }
.ben .ico{ width:23px; height:23px; grid-row:1; }
.ben h3{ margin:0; grid-row:1; font-size:15px; line-height:1.22;
  overflow-wrap:normal; hyphens:manual; }
.ben p{ grid-column:1 / -1; margin-top:6px; font-size:13px; line-height:1.42;
  color:rgba(255,255,255,.68); overflow-wrap:break-word; hyphens:auto; }

/* ── 10. ГЕОГРАФИЯ И ЛИЦЕНЗИЯ ──────────────────────────────── */
.duo{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(18px,2.6vw,28px); align-items:stretch; }
.duo__card{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; box-shadow:var(--shadow); display:flex; flex-direction:column; }
.duo__media{ display:block; background:var(--steel); border-bottom:1px solid var(--line); }
.duo__media--map{ height:300px; display:grid; place-items:center; padding:18px; }
.duo__media--map svg{ width:100%; height:auto; display:block; }
.duo__media--doc{ height:300px; overflow:hidden; display:grid; place-items:start center; padding-top:24px; }
.duo__media--doc img{ width:214px; box-shadow:0 6px 24px rgba(22,36,43,.18); border:1px solid var(--line);
  transition:transform .25s; }
.duo__media--doc:hover img{ transform:translateY(-4px); }
.duo__body{ padding:clamp(20px,2.6vw,30px); flex:1; display:flex; flex-direction:column; align-items:flex-start; }
.duo__body h3{ margin-bottom:10px; }
.duo__body p{ color:var(--ink-soft); font-size:15.5px; line-height:1.55; margin-bottom:18px; }
.duo__body .facts{ width:100%; margin-top:auto; }
.duo__body .btn{ margin-top:auto; }

.geo__ring{ fill:none; stroke:var(--amber); stroke-width:1.1; stroke-opacity:.45; stroke-dasharray:5 6; }
.geo__city{ fill:var(--graphite); fill-opacity:.45; }
.geo__grid{ fill:none; stroke:var(--graphite); stroke-width:.7; stroke-opacity:.16; }
.geo__dot{ fill:var(--amber); }
.geo__pulse{ fill:none; stroke:var(--amber); stroke-width:1.4;
  transform-box:fill-box; transform-origin:center; animation:pulse 3.2s ease-out infinite; }
.geo__pulse--2{ animation-delay:1.6s; }
.geo__label{ font-family:"JetBrains Mono",monospace; font-size:11px; fill:var(--graphite); letter-spacing:.08em; }
.geo__label--dim{ fill:var(--ink-mute); font-size:10px; }
@keyframes pulse{ 0%{ transform:scale(.5); opacity:.85; } 100%{ transform:scale(2.4); opacity:0; } }

.facts{ display:grid; gap:12px; padding-top:18px; border-top:1px solid var(--line-soft); }
.facts div{ display:grid; grid-template-columns:118px minmax(0,1fr); gap:12px; align-items:baseline; }
.facts dt{ font-family:"JetBrains Mono",monospace; font-size:11px; letter-spacing:.09em;
  text-transform:uppercase; color:var(--ink-mute); }
.facts dd{ font-size:15.5px; font-weight:500; }

/* ── 11. ФОРМА ─────────────────────────────────────────────── */
.form-wrap{ display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(26px,4vw,56px); align-items:start; }
.form-intro .sec__h{ margin-bottom:16px; }
.form{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:clamp(22px,3.2vw,34px); display:grid; gap:18px; box-shadow:var(--shadow); }
.row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }

.field{ display:grid; gap:7px; min-width:0; }
.field label{ font-size:14.5px; font-weight:500; }
.req{ color:var(--amber-deep); }

.field input[type="text"],.field input[type="email"],.field input[type="tel"],
.field select,.field textarea{
  width:100%; max-width:100%; font-family:inherit; font-size:16px; color:var(--ink);
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:13px 14px; transition:border-color .18s, box-shadow .18s;
}
.field textarea{ resize:vertical; min-height:96px; }
.field select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='%234F6069' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 14px center; background-size:12px 8px;
  padding-right:38px; cursor:pointer; text-overflow:ellipsis;
}
.field input::placeholder,.field textarea::placeholder{ color:var(--ink-mute); }
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--amber); box-shadow:0 0 0 3px rgba(245,144,18,.22); }
.field.is-bad input,.field.is-bad select,.field.is-bad textarea{ border-color:var(--danger); }

.err{ font-size:13px; color:var(--danger); }
.err:empty{ display:none; }

.field--check{ grid-template-columns:auto minmax(0,1fr); align-items:start; gap:11px; margin-top:2px; }
.field--check input{ width:19px; height:19px; margin-top:2px; accent-color:var(--amber-deep); cursor:pointer; }
.field--check label{ font-size:14px; color:var(--ink-soft); font-weight:400; line-height:1.5; }
.field--check a{ text-decoration:underline; text-underline-offset:2px; }
.field--check .err{ grid-column:1 / -1; }

.hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

.form__note{ font-size:14.5px; color:var(--ink-soft); text-align:center; }
.form__note:empty{ display:none; }
.form__note.is-ok{ color:var(--lime); font-weight:500; }
.form__note.is-bad{ color:var(--danger); }

/* ── 12. КОНТАКТЫ ──────────────────────────────────────────── */
.cta{ background:var(--graphite); color:#fff; padding-block:var(--sec-y); }
.cta__in{ display:block; }
.cta__copy{ max-width:640px; margin-bottom:clamp(32px,4.5vw,52px); }
.cta__lead{ color:rgba(255,255,255,.72); font-size:17px; max-width:52ch; margin-bottom:0; }

.contacts{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  background:var(--graphite-2); border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius); overflow:hidden; }
.contacts li{ padding:24px 22px 26px; display:grid; gap:6px; align-content:start;
  transition:background .2s ease; border-left:1px solid rgba(255,255,255,.14); }
.contacts li:first-child{ border-left:none; }
.contacts li:hover{ background:var(--graphite-3); }
.contacts .ico{ width:26px; height:26px; margin-bottom:6px; }
.contacts__k{ font-family:"JetBrains Mono",monospace; font-size:10.5px; letter-spacing:.11em;
  text-transform:uppercase; color:rgba(255,255,255,.5); }
.contacts__v{ font-family:"Unbounded",sans-serif; font-weight:500; font-size:15.5px;
  letter-spacing:-.03em; color:#fff; overflow-wrap:anywhere; }
a.contacts__v:hover{ color:var(--amber-lite); }
.contacts__n{ font-size:13.5px; color:rgba(255,255,255,.6); line-height:1.4; }

/* ── 13. ПОДВАЛ ────────────────────────────────────────────── */
.foot{ background:var(--graphite-2); color:rgba(255,255,255,.8); padding-top:clamp(40px,5vw,64px); }
.foot a{ color:rgba(255,255,255,.9); }
.foot a:hover{ color:var(--amber-lite); }
.foot h4{ color:#fff; margin-bottom:14px; font-family:"JetBrains Mono",monospace;
  font-weight:500; font-size:11px; letter-spacing:.13em; text-transform:uppercase; }
.foot__in{ display:grid; grid-template-columns:1.4fr 1.1fr 1fr .9fr;
  gap:clamp(22px,3vw,40px); padding-bottom:clamp(30px,4vw,48px); }
.brand--foot{ margin-bottom:14px; }
.brand--foot .brand__mark{ width:44px; }
.brand--foot .brand__name{ font-size:16px; }
.foot__desc{ font-size:14.5px; line-height:1.55; }
.foot__req{ font-size:14px; line-height:1.7; overflow-wrap:break-word; }
.foot__links{ display:grid; gap:10px; font-size:14.5px; line-height:1.4; }
.foot__links li{ overflow-wrap:break-word; }

.foot__bottom{ display:flex; flex-wrap:wrap; gap:8px 26px; justify-content:space-between;
  padding-block:20px 26px; border-top:1px solid rgba(255,255,255,.14);
  font-size:13px; color:rgba(255,255,255,.55); }

/* ── 14. СТРАНИЦЫ ДОКУМЕНТОВ ───────────────────────────────── */
.doc{ padding-block:clamp(34px,5vw,60px) clamp(48px,7vw,84px); }
.doc__back{ display:inline-flex; align-items:center; gap:7px; font-size:14.5px; font-weight:500; margin-bottom:26px; }
.doc h1{ font-size:clamp(24px,3.4vw,38px); margin-bottom:10px; }
.doc__meta{ font-family:"JetBrains Mono",monospace; font-size:12px; letter-spacing:.05em;
  color:var(--ink-mute); margin-bottom:32px; }
.doc__body{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:clamp(22px,4vw,46px); max-width:78ch; }
.doc__body h2{ font-size:clamp(18px,2.2vw,22px); margin:34px 0 12px; }
.doc__body h2:first-child{ margin-top:0; }
.doc__body p{ margin-bottom:13px; color:var(--ink-soft); font-size:16px; overflow-wrap:break-word; }
.doc__body ul,.doc__body ol{ margin:0 0 16px; padding-left:22px; }
.doc__body li{ list-style:disc; margin-bottom:8px; color:var(--ink-soft); font-size:16px; }
.doc__body ol li{ list-style:decimal; }
.doc__body strong{ color:var(--ink); font-weight:600; }

/* ── 15. АДАПТИВ ───────────────────────────────────────────── */
@media (max-width:1160px){
  .nav{ gap:14px; }
  .nav a{ font-size:14px; }
  .tel{ display:none; }
}
@media (max-width:1040px){
  .mosaic{ grid-template-columns:repeat(3,1fr); }
  .nav, .top__cta{ display:none; }
  .burger{ display:flex; }
  .mnav:not([hidden]){ display:flex; }
  .foot__in{ grid-template-columns:1fr 1fr; }
}
@media (max-width:900px){
  .svc, .duo, .form-wrap{ grid-template-columns:1fr; }
  .svc__fig{ display:none; }
  .svc__list{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
  .svc__list li{ margin-left:0 !important; padding:13px 14px; }
  .svc__list li:hover{ transform:none; }
  .svc__list h3{ font-size:14px; line-height:1.22; letter-spacing:-.02em; }
  .svc__list p{ font-size:12.5px; line-height:1.4; }
  .d-pc{ display:none; }
  .d-mob{ display:block; }
  .mosaic .tile:last-child:nth-child(odd){ grid-column:1 / -1; }
  .svc__list li:last-child:nth-child(odd){ grid-column:1 / -1; }
  .contacts{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hero::before{
    background:
      linear-gradient(to bottom, rgba(22,36,43,.86) 0%, rgba(22,36,43,.72) 34%,
      rgba(22,36,43,.82) 62%, var(--graphite) 100%);
  }
  .hero__bg img{ object-position:60% 38%; }
  .sec__h{ max-width:none; }
}
@media (max-width:720px){
  .mosaic{ grid-template-columns:repeat(2,1fr); }
  .tile--w{ grid-column:span 1; }
  .tile span{ left:14px; right:14px; bottom:12px; font-size:13.5px; }
}

@media (max-width:640px){
  body{ font-size:16px; }
  html{ scroll-padding-top:76px; }
  .top__in{ min-height:66px; }
  .brand__mark{ width:42px; }
  .brand__sub{ display:none; }
  .row{ grid-template-columns:1fr; }
  .contacts{ grid-template-columns:1fr; }
  .contacts li{ border-left:none; padding:16px 18px 18px; gap:4px; }
  .contacts li:not(:first-child){ border-top:1px solid rgba(255,255,255,.22); }
  .contacts .ico{ width:22px; height:22px; margin-bottom:2px; }
  .contacts__v{ font-size:14.5px; }
  .contacts__n{ font-size:12.5px; }
  .facts div{ grid-template-columns:1fr; gap:2px; }
  .foot{ padding-top:28px; }
  .foot__in{ grid-template-columns:1fr 1fr; gap:26px 16px; padding-bottom:22px; }
  .foot__col:nth-child(1),.foot__col:nth-child(2){ grid-column:1 / -1; }
  .foot h4{ margin-bottom:9px; font-size:10px; }
  .foot__links{ gap:7px; font-size:13.5px; }
  .foot__desc{ font-size:13.5px; }
  .foot__req{ font-size:13px; line-height:1.55; }
  .brand--foot{ margin-bottom:9px; }
  .foot__bottom{ flex-direction:column; }
  .hero__actions .btn{ flex:1 1 100%; }
  .duo__media--doc{ height:250px; }
  .duo__media--doc img{ width:170px; }
}
@media (max-width:430px){
  .svc__list{ gap:7px; }
  .svc__list li{ padding:11px 12px; }
  .svc__list h3{ font-size:13px; letter-spacing:-.02em; }
  .svc__list p{ font-size:11.5px; line-height:1.38; }
}

@media (max-width:420px){
  .mosaic{ grid-template-columns:1fr; grid-auto-rows:168px; }
  .tile img{ object-position:50% 64%; }
}
@media (min-width:901px){
  .bens{ gap:clamp(14px,1.8vw,20px); }
  .ben{ display:block; padding:22px 20px 24px; }
  .ben .ico{ width:30px; height:30px; }
  .ben h3{ margin:14px 0 7px; font-size:17px; line-height:1.24; }
  .ben p{ margin-top:0; font-size:14.5px; line-height:1.5; }
}

/* ── 16. ДОСТУПНОСТЬ / ПЕЧАТЬ ──────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; }
}
@media print{
  .top,.mnav,.form,.hero__bg,.svc__fig,.cta__fig{ display:none; }
  body{ background:#fff; color:#000; }
  .sec,.cta,.foot,.hero{ background:#fff !important; color:#000 !important; }
  .sec{ padding-block:16px; }
}