/* ============================================================
   ASMO 2026 — «Editorial» design system (clean, OpenAI-grade)
   Inter · monochrome · lots of whitespace · hairline detail
   Light default + refined dark. Colour comes from the photos.
   ============================================================ */

/* Inter — variable, split by script so a Russian page pulls the Cyrillic file and
   an English one never does. The old single file was Google's latin-only subset:
   zero Cyrillic glyphs, so every /ru/ page silently fell back to a system font. */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/inter-latin.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:'Inter';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/inter-latin-ext.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:'Inter';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/inter-cyrillic.woff2) format('woff2');
  unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;
  src:url(../fonts/inter-cyrillic-ext.woff2) format('woff2');
  unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}

/* ---------- tokens : LIGHT (default) ---------- */
:root{
  --bg:#ffffff;
  --bg-2:#f6f6f7;
  --panel:#ffffff;
  --panel-2:#fbfbfc;
  --line:rgba(13,13,13,.09);
  --line-2:rgba(13,13,13,.14);
  --ink:#0d0d0f;
  --ink-2:#3a3a40;
  --muted:#6a6a73;
  --chip:#f2f2f4;
  --chip-line:rgba(13,13,13,.07);
  --btn:#0d0d0f;
  --btn-ink:#ffffff;
  --brand:#0f8a4d;                /* ASMO green — used VERY sparingly */
  --cta-bg:#0d0d0f; --cta-ink:#ffffff; --cta-muted:rgba(255,255,255,.66); --cta-accent:#3ad489;
  --radius:18px; --radius-sm:12px; --radius-lg:26px;
  --shadow-sm:0 1px 2px rgba(13,13,13,.05),0 2px 6px rgba(13,13,13,.05);
  --shadow:0 6px 30px rgba(13,13,13,.08);
  --shadow-lg:0 30px 70px rgba(13,13,13,.14);
  --wrap:1180px; --nav-h:70px;
  --ease:cubic-bezier(.22,.61,.36,1);
}
:root[data-theme="dark"]{
  --bg:#0a0a0b;
  --bg-2:#0f0f11;
  --panel:#111113;
  --panel-2:#141417;
  --line:rgba(255,255,255,.10);
  --line-2:rgba(255,255,255,.17);
  --ink:#f4f4f6;
  --ink-2:#c6c6cd;
  --muted:#9a9aa4;
  --chip:rgba(255,255,255,.06);
  --chip-line:rgba(255,255,255,.11);
  --btn:#ffffff;
  --btn-ink:#0a0a0b;
  --brand:#3ad489;
  --cta-bg:#f4f4f6; --cta-ink:#0d0d0f; --cta-muted:rgba(13,13,15,.62); --cta-accent:#0f8a4d;
  --shadow-sm:0 1px 2px rgba(0,0,0,.4);
  --shadow:0 8px 34px rgba(0,0,0,.5);
  --shadow-lg:0 30px 70px rgba(0,0,0,.6);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  background:var(--bg);color:var(--ink);
  font-size:16px;line-height:1.6;letter-spacing:-.011em;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;
  transition:background .3s var(--ease),color .3s var(--ease);
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
::selection{background:var(--ink);color:var(--bg)}

.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
section{padding:104px 0}
.alt{background:var(--bg-2)}

/* ---------- type ---------- */
.eyebrow{display:inline-block;font-size:13px;font-weight:500;letter-spacing:.01em;color:var(--muted)}
.eyebrow.dot::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--brand);margin-right:9px;vertical-align:1px}
h1,h2,h3,h4{font-weight:600;line-height:1.08;letter-spacing:-.03em;color:var(--ink)}
h1{font-size:clamp(42px,6vw,78px);font-weight:600}
h2{font-size:clamp(30px,4.2vw,50px);margin:16px 0 18px}
h3{font-size:20px;letter-spacing:-.02em}
.lead{color:var(--muted);font-size:clamp(17px,1.6vw,20px);font-weight:400;line-height:1.55;max-width:640px;letter-spacing:-.01em}
.sec-head{max-width:720px;margin-bottom:56px}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head.row{max-width:none;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}
.sec-head h2{margin-bottom:0}
.sec-head .lead{margin-top:16px}

/* ---------- buttons (pill, monochrome) ---------- */
.btn{position:relative;display:inline-flex;align-items:center;gap:9px;height:50px;padding:0 24px;
  border-radius:999px;font-size:15px;font-weight:500;letter-spacing:-.01em;cursor:pointer;border:1px solid transparent;
  transition:transform .25s var(--ease),background .25s,color .25s,border-color .25s,box-shadow .25s;white-space:nowrap}
.btn svg{width:17px;height:17px;transition:transform .25s var(--ease)}
.btn:hover svg{transform:translateX(3px)}
.btn-primary{background:var(--btn);color:var(--btn-ink)}
.btn-primary:hover{transform:translateY(-1px);box-shadow:var(--shadow)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line-2)}
.btn-ghost:hover{background:var(--bg-2);border-color:var(--ink)}
.btn-round{width:44px;height:44px;padding:0;justify-content:center;border-radius:50%;background:transparent;
  border:1px solid var(--line-2);color:var(--ink)}
.btn-round:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* ---------- nav (flat, hairline) ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .3s var(--ease),border-color .3s,backdrop-filter .3s}
/* Readability scrim. The nav floats over hero photos, and the hero's own scrim
   fades out to the right — exactly where the menu sits — so on a light/busy
   photo the links vanished. A soft frosted band, masked so it dissolves instead
   of ending in a hard edge; hidden once .scrolled provides its own glass bar. */
.nav::before{content:'';position:absolute;inset:0 0 auto;height:calc(var(--nav-h) + 48px);pointer-events:none;
  background:color-mix(in srgb,var(--bg) 80%,transparent);
  -webkit-backdrop-filter:blur(9px) saturate(1.15);backdrop-filter:blur(9px) saturate(1.15);
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 44%,rgba(0,0,0,.5) 74%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,#000 44%,rgba(0,0,0,.5) 74%,transparent 100%);
  transition:opacity .3s var(--ease)}
.nav.scrolled::before{opacity:0}
.nav.scrolled{background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:saturate(1.4) blur(16px);border-bottom:1px solid var(--line)}
.nav-inner{position:relative;z-index:1;max-width:1240px;margin:0 auto;height:var(--nav-h);display:flex;align-items:center;gap:30px;padding:0 26px}
.nav-logo img{height:26px;width:auto;filter:brightness(0)}
:root[data-theme="dark"] .nav-logo img{filter:brightness(0) invert(1)}
.nav-menu{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav-menu a{position:relative;padding:9px 13px;font-size:14.5px;font-weight:500;color:var(--muted);border-radius:9px;transition:color .2s,background .2s}
.nav-menu a:hover{color:var(--ink)}
.nav-menu a.active{color:var(--ink);font-weight:550}
/* over the hero photo --muted is too faint — darken while the nav is transparent.
   Weights stay identical in both states so nothing reflows on scroll. */
.nav:not(.scrolled) .nav-menu>a:not(.btn),.nav:not(.scrolled) .nav-drop>a{color:var(--ink-2)}
.nav:not(.scrolled) .nav-menu>a:not(.btn):hover,.nav:not(.scrolled) .nav-drop>a:hover,
.nav:not(.scrolled) .nav-menu>a.active,.nav:not(.scrolled) .nav-drop>a.active{color:var(--ink)}
.nav:not(.scrolled) .theme-toggle{border-color:var(--line-2);background:color-mix(in srgb,var(--bg) 55%,transparent)}
.nav-cta{margin-left:8px;height:40px;padding:0 18px;font-size:14px}
.nav-menu a.btn-primary,.nav-menu a.btn-primary:hover{color:var(--btn-ink);background:var(--btn)}
.nav-drop{position:relative}
.nav-drop>a svg{width:12px;height:12px;margin-left:4px;vertical-align:-1px;transition:transform .2s}
.nav-drop:hover>a svg,.nav-drop:focus-within>a svg,.nav-drop.open>a svg,.nav-drop:hover>button svg,.nav-drop.open>button svg{transform:rotate(180deg)}
.drop-panel{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(6px);min-width:230px;padding:8px;
  border-radius:16px;background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transition:.22s var(--ease)}
.nav-drop:hover .drop-panel,.nav-drop:focus-within .drop-panel,.nav-drop.open .drop-panel{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
/* мост через зазор 8px между пунктом и панелью — иначе меню закрывается на пути мыши */
.drop-panel::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.drop-panel a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;font-size:14px;color:var(--ink-2)}
.drop-panel a:hover{background:var(--bg-2);color:var(--ink)}
.drop-panel .dot{width:5px;height:5px;border-radius:50%;background:var(--muted)}
.theme-toggle{width:40px;height:40px;border-radius:50%;flex:none;margin-left:4px;display:grid;place-items:center;
  background:transparent;border:1px solid var(--line-2);color:var(--ink);cursor:pointer;transition:.2s}
.theme-toggle:hover{background:var(--bg-2)}
.theme-toggle svg{width:18px;height:18px}
.theme-toggle .moon{display:none}
:root[data-theme="dark"] .theme-toggle .sun{display:none}
:root[data-theme="dark"] .theme-toggle .moon{display:block}
.burger{display:none;margin-left:auto;background:none;border:0;cursor:pointer;padding:9px}
.burger span{display:block;width:22px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px;transition:.3s}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---------- hero (photo, light text always) ---------- */
.hero{position:relative;min-height:94vh;display:flex;align-items:flex-end;padding:calc(var(--nav-h) + 80px) 0 76px;overflow:hidden}
.hero.hero-page{min-height:72vh;align-items:center}
.hero-media{position:absolute;inset:0;z-index:-1}
.hero-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);animation:heroZoom 18s var(--ease) forwards}
@keyframes heroZoom{to{transform:scale(1)}}
.hero-media.flip img{transform:scaleX(-1) scale(1.06);animation-name:heroZoomFlip}
@keyframes heroZoomFlip{to{transform:scaleX(-1) scale(1)}}
/* scrim + hero text THEME-AWARE (light photo→dark text / dark photo→white text) */
.hero-media::after{content:'';position:absolute;inset:0;
  /* v2: настоящие снимки пестрее сгенерированных — подложка под текстом плотнее */
  background:linear-gradient(90deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.86) 38%,rgba(255,255,255,var(--scrim,.35)) 62%,rgba(255,255,255,0) 82%),
             linear-gradient(0deg,var(--bg) 1%,rgba(255,255,255,0) 24%)}
:root[data-theme="dark"] .hero-media::after{
  background:linear-gradient(90deg,rgba(0,0,0,.86) 0%,rgba(0,0,0,var(--scrim-d1,.7)) 40%,rgba(0,0,0,var(--scrim-d,.25)) 66%,rgba(0,0,0,var(--scrim-d2,.02)) 84%),
             linear-gradient(0deg,var(--bg) 1%,rgba(0,0,0,0) 26%)}
/* до 1100 подложка во всю ширину: на планшете абзац ~740 выходит за горизонтальную
   подложку (она в процентах ширины) — на главной, «О компании» и «Направления» контраст
   был 1,3–2,9 (второй круг 11.10). Шапки с живыми фото до 1100 — блоком, см. .hero-live */
@media(max-width:1100px){.hero-media::after{background:linear-gradient(0deg,var(--bg) 2%,rgba(255,255,255,.88) 40%,rgba(255,255,255,.78) 100%)}
  :root[data-theme="dark"] .hero-media::after{background:linear-gradient(0deg,var(--bg) 2%,rgba(0,0,0,.78) 40%,rgba(0,0,0,.66) 100%)}}
/* 1101–1279: абзац (до 640) кончается на 56–60 % ширины — там, где горизонтальная
   подложка уже редеет; на 1101 контраст был 3,9–4,35 (второй круг 11.10). Здесь плотная
   часть подложки шире, с 1280 — как выше */
@media(min-width:1101px) and (max-width:1279px){
  .hero-media::after{background:linear-gradient(90deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.86) 46%,rgba(255,255,255,var(--scrim,.35)) 70%,rgba(255,255,255,0) 88%),
             linear-gradient(0deg,var(--bg) 1%,rgba(255,255,255,0) 24%)}
  :root[data-theme="dark"] .hero-media::after{
    background:linear-gradient(90deg,rgba(0,0,0,.86) 0%,rgba(0,0,0,var(--scrim-d1,.7)) 48%,rgba(0,0,0,var(--scrim-d,.25)) 72%,rgba(0,0,0,var(--scrim-d2,.02)) 88%),
               linear-gradient(0deg,var(--bg) 1%,rgba(0,0,0,0) 26%)}}
.hero-inner{position:relative;width:100%;color:var(--ink)}
.hero-inner>*{max-width:680px}
.hero h1{color:var(--ink);letter-spacing:-.035em}
.hero .lead{color:var(--ink-2);margin-top:22px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:36px}
.hero .btn-ghost{color:var(--ink);border-color:var(--line-2);background:color-mix(in srgb,var(--bg) 42%,transparent);backdrop-filter:blur(6px)}
.hero .btn-ghost:hover{background:var(--bg);border-color:var(--ink)}
.crumbs{display:flex;gap:8px;align-items:center;font-size:13px;color:var(--muted);margin-bottom:22px}
.crumbs a:hover{color:var(--ink)}.crumbs b{color:var(--ink);font-weight:500}.crumbs span{opacity:.5}
.hero-eyebrow{margin-bottom:18px}
.hero-eyebrow .eyebrow{color:var(--muted);font-weight:500}
.hero-eyebrow .ticks{display:none}
.sub-dots{font-size:clamp(18px,2vw,26px);font-weight:500;margin-top:20px;color:var(--ink)}
:root[data-theme="dark"] .hero-inner,:root[data-theme="dark"] .hero h1,:root[data-theme="dark"] .sub-dots{color:#fff}
:root[data-theme="dark"] .hero .lead{color:rgba(255,255,255,.82)}
:root[data-theme="dark"] .crumbs{color:rgba(255,255,255,.6)}
:root[data-theme="dark"] .crumbs b{color:#fff}
:root[data-theme="dark"] .hero-eyebrow .eyebrow{color:rgba(255,255,255,.82)}
:root[data-theme="dark"] .hero .btn-ghost{color:#fff;border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.06)}
:root[data-theme="dark"] .hero .btn-ghost:hover{background:rgba(255,255,255,.14);border-color:#fff}
.sub-dots i{font-style:normal;color:var(--brand)}

/* ---------- stats ---------- */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-top:-52px;position:relative;z-index:2}
.stat{padding:28px 26px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s}
.stat:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.stat .ico{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;margin-bottom:18px;background:var(--chip);border:1px solid var(--chip-line);color:var(--ink)}
.stat .ico svg{width:20px;height:20px;stroke:currentColor}
.stat b{display:block;font-size:42px;font-weight:600;letter-spacing:-.04em;line-height:1}
.stat b i{font-style:normal;color:var(--ink)}
.stat>span{display:block;margin-top:8px;color:var(--muted);font-size:14.5px}

/* ---------- product cards (image-led) ---------- */
.prod-row{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.prod-col{display:block;border-radius:var(--radius);overflow:hidden;background:var(--panel);border:1px solid var(--line);
  transition:transform .38s var(--ease),box-shadow .38s,border-color .3s}
.prod-col:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:var(--line-2)}
.prod-col .shot{display:block;aspect-ratio:3/4;overflow:hidden;background:var(--bg-2)}
.prod-col .shot img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.prod-col:hover .shot img{transform:scale(1.05)}
.prod-col .meta{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 18px}
.prod-col .meta .l{display:flex;align-items:center;gap:10px;min-width:0}
.prod-col .ico{flex:none;color:var(--ink)}
.prod-col .ico svg{width:20px;height:20px;stroke:currentColor}
.prod-col h3{font-size:16.5px;font-weight:550;white-space:nowrap}
.prod-col .arr{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line-2);color:var(--ink);transition:.25s}
.prod-col:hover .arr{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.prod-col .arr svg{width:15px;height:15px;stroke:currentColor}

/* ---------- clients strip ---------- */
.clients-strip{padding:40px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.clients-strip .row{display:flex;align-items:center;justify-content:center;gap:16px 44px;flex-wrap:wrap}
.clients-strip .lbl{font-size:13px;color:var(--muted)}
.client{font-size:27px;font-weight:700;letter-spacing:-.03em;color:var(--ink);opacity:.85;transition:opacity .2s}
.client:hover{opacity:1}
.client .b{font-weight:700}

/* ---------- generic cards / services ---------- */
.grid{display:grid;gap:20px}
.grid-3{grid-template-columns:repeat(3,1fr)}
.card{position:relative;border-radius:var(--radius);overflow:hidden;background:var(--panel);border:1px solid var(--line);
  transition:transform .35s var(--ease),box-shadow .35s,border-color .3s}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--line-2)}
.card-body{padding:30px}
.card-body p{color:var(--muted);font-size:15px;margin-top:8px}
.card-icon{width:46px;height:46px;border-radius:12px;display:grid;place-items:center;margin-bottom:22px;background:var(--chip);border:1px solid var(--chip-line);color:var(--ink)}
.card-icon svg{width:23px;height:23px;stroke:currentColor}
.card h3{font-weight:550}
.card .more{display:inline-flex;align-items:center;gap:7px;margin-top:20px;font-size:14.5px;font-weight:500;color:var(--ink)}
.card .more svg{width:15px;height:15px;stroke:currentColor;transition:transform .25s var(--ease)}
.card:hover .more svg{transform:translateX(4px)}

/* ---------- spec cards ---------- */
.specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:-48px;position:relative;z-index:2}
.spec{display:flex;gap:16px;align-items:flex-start;padding:26px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.spec .ico{flex:none;width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--chip);border:1px solid var(--chip-line);color:var(--ink)}
.spec .ico svg{width:23px;height:23px;stroke:currentColor}
.spec .cap{color:var(--muted);font-size:13px;font-weight:500}
.spec b{display:block;font-size:30px;font-weight:600;letter-spacing:-.03em;line-height:1.1;margin-top:2px}
.spec b small{font-size:15px;font-weight:500;color:var(--muted);margin-left:4px}
.spec p{color:var(--muted);font-size:13px;margin-top:6px;line-height:1.5}

/* ---------- split feature ---------- */
.split{display:grid;grid-template-columns:1.02fr .98fr;gap:0;border-radius:var(--radius-lg);overflow:hidden;background:var(--panel);border:1px solid var(--line)}
.split-media{position:relative;min-height:400px}
.split-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.split-body{padding:52px 48px;display:flex;flex-direction:column;justify-content:center}
.chip-list{display:grid;gap:10px;margin-top:26px}
.chip{display:flex;align-items:center;gap:12px;padding:13px 16px;border-radius:12px;background:var(--bg-2);font-size:14.5px;color:var(--ink-2)}
.chip svg{flex:none;width:18px;height:18px;stroke:currentColor;color:var(--ink)}
.split2{display:grid;grid-template-columns:1.02fr .98fr;gap:60px;align-items:center}
.split2 .media{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line)}
.split2 .media img{width:100%;display:block}
.split2 .media .badge{position:absolute;left:18px;bottom:18px;padding:13px 18px;border-radius:14px;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(14px);border:1px solid var(--line);font-size:13px;color:var(--muted)}
.split2 .media .badge b{display:block;font-size:20px;color:var(--ink);font-weight:600}
.checklist li{display:flex;gap:14px;margin:16px 0;color:var(--muted);font-size:15.5px}
.checklist li svg{flex:none;width:20px;height:20px;stroke:currentColor;color:var(--ink);margin-top:3px}
.checklist li b{color:var(--ink);font-weight:550}

/* ---------- feature grid ---------- */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--line)}
.feat{display:flex;gap:16px;padding:30px;background:var(--panel)}
.feat svg{flex:none;width:23px;height:23px;stroke:currentColor;color:var(--ink);margin-top:2px}
.feat b{display:block;font-size:15.5px;font-weight:550;margin-bottom:5px}
.feat p{color:var(--muted);font-size:14px;line-height:1.55}

/* ---------- comparison table ---------- */
.tbl-wrap{overflow-x:auto;border-radius:var(--radius);border:1px solid var(--line);background:var(--panel)}
table.cmp{width:100%;border-collapse:collapse;min-width:780px;font-size:14px}
.cmp th,.cmp td{padding:15px 18px;text-align:center;border-bottom:1px solid var(--line)}
.cmp tr:last-child td{border-bottom:0}
.cmp td:first-child,.cmp th:first-child{text-align:left;color:var(--muted);font-weight:450;white-space:nowrap}
.cmp thead th{font-weight:600;font-size:15px;color:var(--ink)}
.cmp thead th small{display:block;font-weight:400;color:var(--muted);font-size:12px;margin-top:2px}
.cmp .rec{background:var(--bg-2)}
.cmp thead .rec{border-top:2px solid var(--ink)}
.cmp thead .rec .badge{display:inline-block;font-size:11px;font-weight:600;color:var(--btn-ink);background:var(--ink);border-radius:999px;padding:3px 11px;margin-bottom:7px}
.cmp tbody .rec{color:var(--ink);font-weight:600}

/* ---------- process ---------- */
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--line);counter-reset:step}
.step{padding:30px;background:var(--panel)}
.step::before{counter-increment:step;content:counter(step,decimal-leading-zero);display:block;font-size:15px;font-weight:600;color:var(--muted);margin-bottom:16px;font-variant-numeric:tabular-nums}
.step h3{font-weight:550;margin-bottom:8px}
.step p{color:var(--muted);font-size:14px}

/* ---------- galleries ---------- */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.gallery a{position:relative;border-radius:var(--radius-sm);overflow:hidden;aspect-ratio:4/3;border:1px solid var(--line);background:var(--bg-2)}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .55s var(--ease)}
.gallery a:hover img{transform:scale(1.05)}
.apps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.app{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--panel);transition:transform .3s var(--ease),box-shadow .3s}
.app:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.app .shot{aspect-ratio:4/3;overflow:hidden;background:var(--bg-2)}
.app .shot img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.app:hover .shot img{transform:scale(1.05)}
.app .bar{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;font-weight:550;font-size:15px}
.app .bar svg{width:16px;height:16px;stroke:currentColor;color:var(--muted)}
.patterns{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.pat{text-align:center}
.pat .tile{aspect-ratio:1/1;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--line);background:var(--panel)}
.pat .tile img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.pat:hover .tile img{transform:scale(1.06)}
.pat span{display:block;margin-top:10px;font-size:13.5px;color:var(--muted)}
.s2s{display:grid;grid-template-columns:1fr 1.1fr 1.1fr;gap:0;align-items:stretch;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--panel)}
.s2s .body{padding:42px 38px;display:flex;flex-direction:column;justify-content:center;gap:14px}
.s2s .ph{position:relative;min-height:320px;background:var(--bg-2)}
.s2s .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.s2s .ph .tag{position:absolute;left:14px;top:14px;font-size:12px;font-weight:500;padding:5px 12px;border-radius:999px;background:color-mix(in srgb,var(--bg) 85%,transparent);border:1px solid var(--line);backdrop-filter:blur(8px);color:var(--ink)}
.s2s .mid-arrow{position:absolute;right:-21px;top:50%;transform:translateY(-50%);z-index:3;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--bg);box-shadow:var(--shadow)}
.s2s .mid-arrow svg{width:18px;height:18px;stroke:currentColor}

/* ---------- lightbox ---------- */
.lightbox{position:fixed;inset:0;z-index:200;display:none;place-items:center;background:rgba(8,8,10,.86);backdrop-filter:blur(10px);cursor:zoom-out;padding:40px}
.lightbox.open{display:grid}
.lightbox img{max-width:min(1080px,92vw);max-height:86vh;border-radius:14px;box-shadow:var(--shadow-lg)}

/* ---------- CTA (dark block) ---------- */
.cta-band{position:relative;border-radius:var(--radius-lg);padding:64px 56px;background:var(--cta-bg);color:var(--cta-ink);
  display:flex;align-items:center;justify-content:space-between;gap:34px;flex-wrap:wrap;box-shadow:var(--shadow)}
.cta-band h2{color:var(--cta-ink);letter-spacing:-.03em}
.cta-band h2 i{font-style:normal;color:var(--cta-accent)}
.cta-band p{color:var(--cta-muted);font-size:16px;margin-top:8px}
.cta-band .btn{background:var(--cta-ink);color:var(--cta-bg);border-color:var(--cta-ink)}
.cta-band .btn:hover{transform:translateY(-1px);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.cta-stats{display:flex;gap:40px}
.cta-stats b{display:block;font-size:34px;font-weight:600;letter-spacing:-.03em;color:var(--cta-ink)}
.cta-stats span{font-size:13px;color:var(--cta-muted)}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1.08fr;gap:24px;align-items:stretch}
.form-card{padding:38px;border-radius:var(--radius-lg);background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.field{margin-bottom:18px}
.field label{display:block;font-size:13.5px;font-weight:500;color:var(--ink-2);margin-bottom:8px}
.field input,.field textarea{width:100%;padding:14px 16px;border-radius:12px;font:inherit;font-size:15px;color:var(--ink);background:var(--bg);border:1px solid var(--line-2);outline:0;transition:border-color .2s,box-shadow .2s}
.field input:focus,.field textarea:focus{border-color:var(--ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--ink) 12%,transparent)}
.field input.err,.field textarea.err{border-color:#e5484d;box-shadow:0 0 0 3px rgba(229,72,77,.14)}
.field textarea{min-height:130px;resize:vertical}
.form-note{font-size:13px;color:var(--muted);margin-top:14px}
/* форма заявки → сервис заявок (assets/js/lead.js): ошибки полей, +998, согласие, плашки «не ушло», «отправлено» */
.field .opt{font-weight:400;color:var(--muted)}
.field-err{margin-top:6px;font-size:13px;line-height:1.45;color:#c4262c}
:root[data-theme="dark"] .field-err{color:#ff8a8d}
.field.is-err input,.field.is-err select,.field.is-err textarea{border-color:#e5484d;box-shadow:0 0 0 3px rgba(229,72,77,.14)}
.tel-wrap{display:flex;align-items:stretch}
.tel-wrap span{display:flex;align-items:center;padding:0 12px 0 16px;border:1px solid var(--line-2);border-right:0;border-radius:12px 0 0 12px;background:var(--bg-2);color:var(--ink-2);font-size:15px;font-variant-numeric:tabular-nums}
.field .tel-wrap input{border-radius:0 12px 12px 0;min-width:0}
.field.is-err .tel-wrap span{border-color:#e5484d}
.lf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.lf-agree{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;align-items:start;margin:4px 0 18px;font-size:13.5px;line-height:1.5;color:var(--ink-2)}
.lf-agree input{width:20px;height:20px;margin-top:1px;accent-color:var(--ink);cursor:pointer}
.lf-agree label{cursor:pointer}
.lf-agree a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.lf-agree .field-err{grid-column:2;margin-top:0}
.lf-agree.is-err input{outline:2px solid #e5484d;outline-offset:2px}
.lf-fail{margin:0 0 16px;padding:12px 16px;border-radius:12px;font-size:14px;line-height:1.5;background:color-mix(in srgb,#e5484d 9%,var(--panel));border:1px solid color-mix(in srgb,#e5484d 35%,transparent);color:var(--ink)}
.lf-fail[hidden]{display:none}
.lf-fail a{color:var(--ink);font-weight:600;white-space:nowrap}
.lead-form [data-form-submit][aria-disabled="true"]{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
.lead-form.is-busy [data-form-submit]{cursor:progress}
.lf-ok{display:flex;gap:16px;align-items:flex-start;padding:22px;border-radius:var(--radius-sm);background:color-mix(in srgb,var(--brand) 9%,var(--panel));border:1px solid color-mix(in srgb,var(--brand) 30%,transparent)}
.lf-ok[hidden],.lf-body[hidden]{display:none}
.lf-ok>svg{width:28px;height:28px;flex:none;color:var(--brand)}
.lf-ok h3{font-size:19px;font-weight:600;letter-spacing:-.02em;outline:0}
.lf-ok p{margin:6px 0 14px;font-size:14.5px;color:var(--ink-2)}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#map{min-height:540px;height:100%;border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow-sm);position:relative;z-index:1}
.leaflet-container{background:var(--bg-2) !important;font-family:'Inter',sans-serif !important}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--panel) !important;color:var(--ink) !important;box-shadow:var(--shadow) !important;border:1px solid var(--line)}
.leaflet-popup-content{font-size:13.5px;line-height:1.5}
.map-pin{position:relative}
.map-pin .ring{position:absolute;inset:-14px;border-radius:50%;border:2px solid var(--ink);opacity:.5;animation:ring 2.4s infinite}
@keyframes ring{0%{transform:scale(.5);opacity:.6}100%{transform:scale(1.4);opacity:0}}
.map-pin .core{width:16px;height:16px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 4px var(--bg)}
.info-cards{display:grid;gap:12px;margin-top:24px}
.info-card{display:flex;align-items:center;gap:16px;padding:18px 20px;border-radius:var(--radius-sm);background:var(--panel);border:1px solid var(--line)}
.info-card svg{width:21px;height:21px;stroke:currentColor;color:var(--ink);flex:none}
.info-card b{display:block;font-size:14px;font-weight:550}
.info-card span{font-size:13px;color:var(--muted)}

/* ---------- footer ---------- */
footer{margin-top:0;border-top:1px solid var(--line);background:var(--bg)}
.foot-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:44px;padding:72px 0 44px}
.foot-grid img{height:26px;width:auto;margin-bottom:20px;filter:brightness(0)}
:root[data-theme="dark"] .foot-grid img{filter:brightness(0) invert(1)}
.foot-grid p{color:var(--muted);font-size:14.5px;max-width:280px}
.foot-grid h4{font-size:13px;color:var(--ink);margin-bottom:18px;font-weight:550}
.foot-grid li{margin:11px 0}
.foot-grid li a{color:var(--muted);font-size:14.5px;transition:color .2s}
.foot-grid li a:hover{color:var(--ink)}
.socials{display:flex;gap:8px;margin-top:22px}
.socials a{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:transparent;border:1px solid var(--line-2);transition:.25s}
.socials a:hover{background:var(--ink);border-color:var(--ink)}
.socials svg{width:17px;height:17px;fill:var(--muted);transition:fill .25s}
.socials a:hover svg{fill:var(--bg)}
.foot-bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:24px 0;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
.foot-bottom .mark{color:var(--muted)}

/* ---------- reveal ---------- */
.js .rv{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .rv.in{opacity:1;transform:none}
.rv-d1{transition-delay:.06s}.rv-d2{transition-delay:.12s}.rv-d3{transition-delay:.18s}
.rv-d4{transition-delay:.24s}.rv-d5{transition-delay:.3s}
@media(prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}.hero-media img{animation:none}}

/* ---------- responsive ---------- */
@media(max-width:1024px){
  .grid-3,.feat-grid,.apps{grid-template-columns:repeat(2,1fr)}
  .prod-row{grid-template-columns:repeat(3,1fr)}
  .patterns{grid-template-columns:repeat(3,1fr)}
  .process{grid-template-columns:repeat(2,1fr)}
  .split,.split2,.s2s,.contact-grid{grid-template-columns:1fr}
  .s2s .mid-arrow{display:none}
  #map{min-height:420px}.foot-grid{grid-template-columns:1fr 1fr}.specs{grid-template-columns:1fr 1fr}
}
/* плашки цифр на планшете — три в ряд, значок над текстом: сеткой 2+1 у третьей
   плашки пустовала половина ряда (второй круг 11.10) */
@media(min-width:761px) and (max-width:1024px){
  .specs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .spec{flex-direction:column;gap:12px;padding:22px}
  .spec b{font-size:24px}
}
@media(max-width:760px){
  section{padding:66px 0}
  .grid-3,.gallery,.feat-grid,.apps,.process,.specs{grid-template-columns:1fr}
  .prod-row,.patterns{grid-template-columns:1fr 1fr}
  .stats{grid-template-columns:1fr 1fr;margin-top:-36px}
  .cta-band{padding:40px 28px}.cta-stats{gap:26px}
  .foot-grid{grid-template-columns:1fr;gap:30px}
  .hero{min-height:82vh}
  /* a phone shows only the middle third of the home photo, and the machine head
     with the ASMO plate sits right of centre in both theme variants — frame it */
  .hero:not(.hero-page) .hero-media img{object-position:82% 50%}
}
/* меню бургером — на телефоне и узком планшете (до 960). Меню в одну строку занимает
   818–914 px (en/uz/ru): на 768 пункты переносились в две строки, а кнопка темы уезжала
   за правый край. Правила стоят на прежнем месте каскада — телефон не меняется */
@media(max-width:960px){
  .nav-menu{position:fixed;top:var(--nav-h);left:0;right:0;flex-direction:column;align-items:stretch;gap:2px;padding:16px 22px 26px;
    background:var(--bg);border-bottom:1px solid var(--line);transform:translateY(-130%);transition:transform .35s var(--ease);margin-left:0}
  .nav-menu.open{transform:none}
  .nav-menu a{padding:14px}.nav-cta{margin:10px 0 0;justify-content:center}
  .burger{display:block}
  .nav-drop .drop-panel{position:static;transform:none;opacity:1;visibility:visible;min-width:0;background:transparent;border:0;box-shadow:none;padding:0 0 0 16px}
}
/* шире 960 меню в строку: подпись пункта не переносится на вторую строку */
@media(min-width:961px){.nav-menu>a,.nav-drop>a,.lang-btn{white-space:nowrap}}

/* ---------- language switcher ---------- */
.lang-switch>a,.lang-btn{font:inherit;font-size:13.5px;font-weight:500;color:var(--muted);text-transform:uppercase;letter-spacing:.02em}
.lang-btn{background:none;border:0;cursor:pointer;padding:9px 13px;border-radius:9px;display:inline-flex;align-items:center;gap:4px}
.lang-btn svg{width:12px;height:12px;transition:transform .2s}
.lang-switch>a:hover,.lang-btn:hover{color:var(--ink)}
.lang-switch .drop-panel{min-width:150px}
.drop-panel a.on{color:var(--ink);font-weight:600;background:var(--bg-2)}
@media(max-width:960px){.lang-switch{margin-top:6px}}

/* ============================================================
   AGENT WIDGET (AE-01)
   ============================================================ */
.asmo-agent{position:fixed;right:22px;bottom:22px;z-index:300;font-family:'Inter',sans-serif}
.aa-fab{width:72px;height:72px;border:0;cursor:pointer;padding:0;background:none;box-shadow:none;
  display:grid;place-items:center;transition:transform .25s var(--ease)}
.aa-fab:hover{transform:translateY(-3px) scale(1.04)}
.aa-fab:active{transform:translateY(-1px) scale(.98)}
.asmo-agent.open .aa-fab{transform:scale(.92)}

/* ---------- the presence: the head IS the launcher ----------
   No disc behind it — the robot sits straight on the page, watches the pointer,
   blinks, and changes its mouth with the engine's state. Drawn as SVG, so it costs
   kilobytes and stays crisp at any size. */
.aa-fab{position:relative;overflow:visible}
.aa-avhead{position:absolute;inset:-6%;opacity:0;transition:opacity .35s var(--ease);
  filter:drop-shadow(0 10px 18px rgba(13,13,15,.28))}
.aa-avhead svg{width:100%;height:100%;display:block}
.aa-fab.aa-av-ready .aa-avhead{opacity:1}
.aa-panel{position:absolute;right:0;bottom:76px;width:min(380px,calc(100vw - 32px));height:min(560px,calc(100vh - 130px));
  display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:20px;overflow:hidden;
  box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(12px) scale(.98);transform-origin:bottom right;transition:.26s var(--ease)}
.asmo-agent.open .aa-panel{opacity:1;visibility:visible;transform:none}
.aa-head{display:flex;align-items:center;gap:8px;padding:15px 16px;border-bottom:1px solid var(--line)}
.aa-head b{font-weight:600;letter-spacing:-.02em}
/* строка о том, кто отвечает и куда уходит текст (политика, 12.10) */
.aa-note{margin:0;padding:8px 16px;font-size:12px;line-height:1.45;color:var(--muted);border-bottom:1px solid var(--line);background:var(--bg-2)}
.aa-note a{color:var(--ink-2);text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.aa-head .aa-sub{font-size:13px;color:var(--muted);margin-right:auto}
.aa-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.18)}
.aa-x{background:none;border:0;color:var(--muted);cursor:pointer;padding:4px;border-radius:8px}
.aa-x:hover{color:var(--ink);background:var(--bg-2)}.aa-x svg{width:18px;height:18px}
.aa-log{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.aa-msg{max-width:86%;padding:10px 14px;border-radius:14px;font-size:14.5px;line-height:1.5;white-space:pre-wrap;word-wrap:break-word}
.aa-bot{align-self:flex-start;background:var(--bg-2);color:var(--ink);border-bottom-left-radius:5px}
.aa-user{align-self:flex-end;background:var(--ink);color:var(--bg);border-bottom-right-radius:5px}
.aa-typing{display:flex;gap:4px;align-items:center}
.aa-typing span{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:aablink 1.2s infinite}
.aa-typing span:nth-child(2){animation-delay:.2s}.aa-typing span:nth-child(3){animation-delay:.4s}
@keyframes aablink{0%,60%,100%{opacity:.3}30%{opacity:1}}
.aa-chips{display:flex;gap:8px;padding:0 16px 10px;flex-wrap:wrap}
.aa-chip{font-size:13px;padding:7px 13px;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:var(--ink-2);cursor:pointer;transition:.2s}
.aa-chip:hover{background:var(--bg-2);border-color:var(--ink)}
.aa-composer{display:flex;align-items:flex-end;gap:8px;padding:12px 12px 14px;border-top:1px solid var(--line)}
.aa-composer textarea{flex:1;resize:none;border:1px solid var(--line-2);border-radius:14px;padding:11px 14px;font:inherit;font-size:14.5px;
  color:var(--ink);background:var(--bg);outline:0;max-height:120px;transition:border-color .2s}
.aa-composer textarea:focus{border-color:var(--ink)}
.aa-composer.aa-busy{opacity:.7}
.aa-send{width:42px;height:42px;flex:none;border-radius:50%;border:0;cursor:pointer;background:var(--ink);color:var(--bg);display:grid;place-items:center;transition:transform .2s}
.aa-send:hover{transform:translateY(-1px)}.aa-send svg{width:18px;height:18px}
@media(max-width:760px){.asmo-agent{right:14px;bottom:14px}.aa-panel{bottom:72px;height:min(70vh,540px)}}

/* status line under the log while tools are running */
.aa-status{padding:0 16px 8px;font-size:12.5px;color:var(--muted)}
.aa-status::before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--brand);
  margin-right:7px;vertical-align:2px;animation:aablink 1.1s infinite}

/* offer chip — a follow-up the agent proposes; the label always comes from the
   site map or the agent's own command, never from free text */
.aa-offer{align-self:flex-start;max-width:86%;text-align:left;padding:9px 14px;border-radius:14px;
  border:1px solid var(--line-2);background:transparent;color:var(--ink);font:inherit;font-size:14px;
  cursor:pointer;transition:.2s}
.aa-offer:hover{background:var(--bg-2);border-color:var(--ink)}
.aa-offer:disabled{opacity:.5;cursor:default}

/* confirmation card — every write into the quote form stops here */
.aa-confirm{align-self:stretch;padding:14px;border-radius:14px;background:var(--bg-2);border:1px solid var(--line-2)}
.aa-c-head{font-size:13.5px;font-weight:550;margin-bottom:10px}
.aa-c-row{font-size:12.5px;color:var(--muted)}
.aa-c-old{font-size:13px;color:var(--muted);text-decoration:line-through;margin-top:4px;word-break:break-word}
.aa-c-new{font-size:14.5px;margin-top:4px;word-break:break-word}
.aa-c-warn{margin-top:8px;font-size:12.5px;color:#c2410c}
:root[data-theme="dark"] .aa-c-warn{color:#fb923c}
.aa-c-btns{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.aa-c-btns button{padding:8px 14px;border-radius:999px;font:inherit;font-size:13.5px;cursor:pointer;
  border:1px solid var(--line-2);background:transparent;color:var(--ink);transition:.2s}
.aa-c-btns button:hover{border-color:var(--ink)}
.aa-c-ok{background:var(--ink) !important;color:var(--bg) !important;border-color:var(--ink) !important}
.aa-c-editbox{display:flex;gap:8px;margin-top:12px}
.aa-c-editbox textarea{flex:1;resize:vertical;border:1px solid var(--line-2);border-radius:10px;padding:8px 10px;
  font:inherit;font-size:14px;color:var(--ink);background:var(--bg);outline:0}
.aa-c-save{padding:0 14px;border-radius:10px;border:0;background:var(--ink);color:var(--bg);font:inherit;font-size:13.5px;cursor:pointer}

/* ---------- spotlight: what the agent is pointing at ----------
   A hole with a huge outer shadow dims everything else, a ring frames the target,
   soft marks tag the companions. All pointer-events:none — the page stays usable. */
.cop-hole{position:fixed;z-index:190;border-radius:14px;pointer-events:none;
  box-shadow:0 0 0 9999px rgba(10,10,12,.5);transition:all .18s var(--ease)}
.cop-ring{position:fixed;z-index:191;border-radius:16px;pointer-events:none;background:transparent;
  border:2.5px solid var(--brand);transition:all .18s var(--ease);animation:cop-pulse 1.6s ease-in-out infinite}
.cop-mark{position:fixed;z-index:189;border-radius:10px;pointer-events:none;
  border:2px solid color-mix(in srgb,var(--brand) 85%,transparent);
  background:color-mix(in srgb,var(--brand) 14%,transparent);transition:all .18s var(--ease)}
@keyframes cop-pulse{
  0%,100%{box-shadow:0 0 0 2px color-mix(in srgb,var(--brand) 45%,transparent),0 0 16px 3px color-mix(in srgb,var(--brand) 45%,transparent)}
  50%    {box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 28%,transparent),0 0 26px 7px color-mix(in srgb,var(--brand) 55%,transparent)}}
@media(prefers-reduced-motion:reduce){.cop-ring{animation:none}}

/* home: RFID and Cargo get their own row of wide cards under the textile products;
   the cards link out to the directions' own sites (EXTERNAL in build.mjs) */
.dir-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.dir-row .prod-col .shot{aspect-ratio:16/9}
@media (max-width:760px){ .dir-row{grid-template-columns:1fr} }

/* ---------- the emerald logo (SVG, lit by filters — see logoSvg in build.mjs) ---------- */
.nav-logo{display:flex;align-items:center}
.logo-em{display:block;height:26px;width:auto;overflow:visible}
.foot-grid .logo-em{height:30px;margin-bottom:20px}
.logo-glint{transform:translateX(0)}
.nav-logo:hover .logo-glint,.nav-logo:focus-visible .logo-glint{animation:logoGlint 1s var(--ease)}
@keyframes logoGlint{from{transform:translateX(0)}to{transform:translateX(1900px)}}
@media (prefers-reduced-motion:reduce){.nav-logo:hover .logo-glint,.nav-logo:focus-visible .logo-glint{animation:none}}
/* products that live on their own site carry a small ↗ in the menu */
.drop-panel .ext{margin-left:auto;padding-left:10px;font-size:12px;opacity:.5}

/* ============================================================
   v2 (10.10.2026): структура 03-struktura — группы направлений, мега-меню,
   партнёры, настоящие фото с подписями, FAQ, форма с выбором направления
   ============================================================ */
.skip{position:absolute;left:12px;top:-60px;z-index:400;padding:10px 16px;border-radius:10px;background:var(--ink);color:var(--bg);font-size:14px}
.skip:focus{top:12px}
.wrap.narrow{max-width:880px}
.lead-sm{font-size:clamp(16px,1.4vw,18px);margin-bottom:16px}
.muted{color:var(--muted)}
.btn-sm{height:40px;padding:0 16px;font-size:14px}
.btn-wide{width:100%;justify-content:center}

/* hero: главная — заголовок длиннее, поэтому мельче; страницы без фото — спокойный фон */
.hero-home h1{font-size:clamp(34px,4.8vw,62px);max-width:760px}
.hero-page h1{font-size:clamp(34px,5vw,64px)}
.hero.hero-plain{min-height:auto;padding:calc(var(--nav-h) + 72px) 0 72px;
  background:radial-gradient(1200px 420px at 85% -10%,color-mix(in srgb,var(--brand) 14%,transparent),transparent 70%),var(--bg-2);
  border-bottom:1px solid var(--line)}
.hero.hero-plain+.specs-sec .specs{margin-top:28px}
.crumbs{flex-wrap:wrap}

/* цифры: числа сразу в HTML, без счётчика с нуля */
.stats-sec{padding:0}
.stats-5{grid-template-columns:repeat(5,1fr)}
.stat b{white-space:nowrap}
.specs-sec{padding:0}

/* мега-меню направлений */
.drop-panel.mega{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:4px 10px;min-width:720px;padding:16px;left:0;transform:translateY(6px)}
.nav-drop.dirs-drop:hover .drop-panel.mega,.nav-drop.dirs-drop:focus-within .drop-panel.mega{transform:translateY(0)}
/* на компьютере панель стоит по правому краю меню, а не от пункта «Направления»: на
   ширине 1025–1280 в en (пункт правее, чем в uz/ru) панель 720 уходила за правый край
   экрана и срезала колонку «Сервисы и IT» (третий круг 11.10). Не уже самого меню —
   так она всегда лежит и под пунктом, и наведение не обрывается по пути вниз */
@media(min-width:961px){
  .nav-menu{position:relative}
  .nav-drop.dirs-drop{position:static}
  .drop-panel.mega{left:auto;right:0;min-width:max(720px,100%);max-width:calc(100vw - 32px)}
  /* панель на 8 px ниже пункта, чем прежде (меню выше пункта) — мостик для мыши выше */
  .drop-panel.mega::before{top:-22px;height:22px}
}
.mega-col{display:flex;flex-direction:column;gap:2px;min-width:0}
.mega-col b{font-size:12px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:var(--muted);padding:6px 12px}
.mega-col a{padding:8px 12px;font-size:14px}
.mega-all{grid-column:1/-1;justify-content:flex-end;margin-top:6px;border-top:1px solid var(--line);border-radius:0 !important;padding-top:12px !important;font-weight:550;color:var(--ink) !important}
.mega-all svg{width:15px;height:15px}
.nav-menu .ext{margin-left:3px;font-size:12px;opacity:.55}

/* группы направлений и карточки */
.dgroup{margin-top:56px}
.dgroup:first-child{margin-top:0}
.sec-head+.dgroup{margin-top:0}
.dgroup-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px 32px;flex-wrap:wrap;padding-bottom:16px;margin-bottom:20px;border-bottom:1px solid var(--line)}
.dgroup-title{font-size:22px;font-weight:600}
.dgroup-head p{color:var(--muted);font-size:15px;max-width:620px}
.dcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
/* главная: четыре группы списком */
.gcards{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.gcard{padding:28px 28px 18px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line)}
.gcard h3{font-size:21px;font-weight:600}
.gcard>p{color:var(--muted);font-size:14.5px;margin:6px 0 14px}
.gcard ul{border-top:1px solid var(--line)}
.gcard li a{display:flex;align-items:center;gap:14px;padding:13px 4px;border-bottom:1px solid var(--line);transition:background .2s}
.gcard li:last-child a{border-bottom:0}
.gcard li a:hover{background:var(--bg-2)}
.gcard .ico{flex:none;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--chip);border:1px solid var(--chip-line);color:var(--ink)}
.gcard .ico svg{width:19px;height:19px}
.gcard .gtx{flex:1;min-width:0;display:flex;flex-direction:column}
.gcard .gtx b{font-weight:600;font-size:15.5px}
.gcard .gtx b .ext{font-size:12px;opacity:.5;font-weight:400}
.gcard .gtx small{color:var(--muted);font-size:13.5px;line-height:1.45}
.gcard li a>svg{flex:none;width:16px;height:16px;color:var(--muted);transition:transform .25s var(--ease)}
.gcard li a:hover>svg{transform:translateX(3px);color:var(--ink)}
@media(max-width:760px){.gcards{grid-template-columns:1fr}.gcard{padding:22px 18px 10px}.dcards{grid-template-columns:1fr}}
.dcard{display:flex;flex-direction:column;border-radius:var(--radius);overflow:hidden;background:var(--panel);border:1px solid var(--line);
  transition:transform .35s var(--ease),box-shadow .35s,border-color .3s;min-width:0}
a.dcard:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--line-2)}
.dcard .shot{display:block;aspect-ratio:16/10;overflow:hidden;background:var(--bg-2);position:relative}
.dcard .shot img{width:100%;height:100%;object-fit:cover;transition:transform .55s var(--ease)}
a.dcard:hover .shot img{transform:scale(1.04)}
.dcard .shot-ext{display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,color-mix(in srgb,var(--brand) 16%,transparent),transparent 60%),var(--bg-2)}
.dcard .body{display:flex;flex-direction:column;gap:8px;padding:18px 20px 20px;flex:1}
.dcard .ttl{display:flex;align-items:center;gap:10px}
.dcard .ttl .ico{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--chip);border:1px solid var(--chip-line);color:var(--ink)}
.dcard .ttl .ico svg{width:18px;height:18px}
.dcard h3{font-size:17px;font-weight:600;letter-spacing:-.015em}
.dcard h3 .ext{font-size:13px;opacity:.5}
.dcard p{color:var(--muted);font-size:14.5px;line-height:1.5}
.dcard .more{margin-top:auto;padding-top:6px;display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:500;color:var(--ink)}
.dcard .more svg{width:15px;height:15px;transition:transform .25s var(--ease)}
a.dcard:hover .more svg{transform:translateX(4px)}
.dcards.compact .dcard .shot{aspect-ratio:16/9}
.dcard.dline{grid-column:1/-1;flex-direction:row;align-items:center;gap:18px;padding:18px 20px}
.dcard.dline h3{margin-bottom:4px}
.dcard.dline>div{flex:1;min-width:0}
.dl-ico{flex:none;width:46px;height:46px;border-radius:12px;display:grid;place-items:center;background:var(--chip);border:1px solid var(--chip-line)}
.dl-ico svg{width:22px;height:22px}

/* нейтральная плашка вместо фото: без подписи «наше» */
.ph-none{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;width:100%;height:100%;min-height:160px;
  background:repeating-linear-gradient(135deg,var(--bg-2) 0 14px,color-mix(in srgb,var(--bg-2) 70%,var(--line)) 14px 15px);color:var(--muted)}
.ph-ico{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:var(--panel);border:1px solid var(--line);color:var(--ink)}
.ph-ico svg{width:26px;height:26px}
.ph-none small{font-size:13px}
.split-media .ph-none{position:absolute;inset:0}

/* «что предлагаем» */
.chip>span b{color:var(--ink);font-weight:600}
.price-note{display:flex;gap:12px;align-items:flex-start;margin-top:22px;padding:14px 16px;border-radius:12px;border:1px dashed var(--line-2);font-size:14.5px;color:var(--ink-2)}
.price-note svg{flex:none;width:20px;height:20px;margin-top:2px;color:var(--ink)}
.related{margin-top:18px;font-size:14.5px;color:var(--muted)}
.related a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}

/* размеры термопрессов */
.sizes-sec{padding-top:0}
.sizes{padding:30px;border-radius:var(--radius);border:1px solid var(--line);background:var(--panel)}
.sizes h3{margin-bottom:18px}
.sz-row{display:grid;grid-template-columns:200px 1fr;gap:12px;padding:12px 0;border-top:1px solid var(--line);align-items:center}
.sz-k{color:var(--muted);font-size:14.5px}
.sz-v{display:flex;flex-wrap:wrap;gap:8px}
.sz{padding:6px 12px;border-radius:999px;background:var(--bg-2);border:1px solid var(--chip-line);font-size:14px;font-variant-numeric:tabular-nums}
.sz-note{margin-top:14px;font-size:13.5px;color:var(--muted)}

/* фото с подписями (лайтбокс из main.js) */
.pgal{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.pgal figure{margin:0;min-width:0}
.pgal .shot{display:block;aspect-ratio:4/3;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--line);background:var(--bg-2);cursor:zoom-in}
.pgal img{width:100%;height:100%;object-fit:cover;transition:transform .55s var(--ease)}
.pgal .shot:hover img{transform:scale(1.04)}
.pgal figcaption{margin-top:9px;font-size:13.5px;color:var(--muted)}

/* партнёры: логотипы на белом в обеих темах — так они нарисованы */
.partners-sec{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg-2)}
.partners{display:grid;grid-template-columns:repeat(8,1fr);gap:12px}
.partners li{display:grid;place-items:center;height:84px;padding:12px;border-radius:12px;background:#fff;border:1px solid rgba(13,13,13,.08)}
.partners img{max-width:100%;max-height:56px;width:auto;height:auto;object-fit:contain}

/* вопросы-ответы */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:16px;padding:20px 0;font-weight:550;font-size:16.5px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line-2);font-weight:400;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 44px 20px 0;color:var(--muted);font-size:15.5px}
.faq-sec{padding-top:0}
.order-sec{padding-top:0}

/* история главами */
.chapters{list-style:none;position:relative;display:grid;gap:4px}
.chapters::before{content:"";position:absolute;left:31px;top:12px;bottom:12px;width:1px;background:var(--line-2)}
.ch{position:relative;display:flex;gap:22px;align-items:flex-start;padding:14px 0}
.ch-badge{flex:none;position:relative;z-index:1;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--panel);border:1px solid var(--line-2);font-weight:650;font-size:15px;letter-spacing:-.02em;color:var(--ink)}
.ch-badge svg{width:24px;height:24px}
.ch h3{margin:8px 0 6px}
.ch p{color:var(--muted);font-size:15.5px}
.ch p a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.history-sec{padding-top:0}

/* страны */
.countries{display:flex;flex-wrap:wrap;gap:10px}
.countries li{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:var(--panel);border:1px solid var(--line);font-size:15px}
.countries svg{width:17px;height:17px;color:var(--muted)}
.geo-sec{padding-top:0}

/* форма заявки и контакты */
.lead-sec{background:var(--bg-2);border-top:1px solid var(--line)}
.h-form{font-size:26px;margin:0 0 8px}
.form-sub{color:var(--muted);font-size:14.5px;margin-bottom:22px}
.field select{width:100%;padding:14px 40px 14px 16px;border-radius:12px;font:inherit;font-size:15px;color:var(--ink);background-color:var(--bg);border:1px solid var(--line-2);outline:0;
  appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);
  background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat}
.field select:focus{border-color:var(--ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--ink) 12%,transparent)}
.lead-sec .info-cards{margin-top:14px}
.info-card .fill-ico{fill:var(--ink);stroke:none}
.info-card span a{color:var(--ink)}
.info-card span{line-height:1.7}

/* карта ссылками */
.map-sec{padding-bottom:0}
.map-card{display:flex;gap:26px;align-items:flex-start;padding:36px;border-radius:var(--radius-lg);border:1px solid var(--line);background:var(--panel)}
.map-ico{flex:none;width:64px;height:64px;border-radius:18px;display:grid;place-items:center;background:var(--chip);border:1px solid var(--chip-line)}
.map-ico svg{width:30px;height:30px}
.map-body h2{font-size:clamp(26px,3vw,36px);margin:0 0 10px}
.map-btns{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px}

/* подвал */
.foot-h{font-size:13px;color:var(--ink);margin:0 0 18px;font-weight:550;letter-spacing:0}
.foot-grid li.muted-li{color:var(--muted);font-size:14px;line-height:1.5}

@media(max-width:1024px){
  .stats-5{grid-template-columns:repeat(3,1fr)}
  .partners{grid-template-columns:repeat(4,1fr)}
  .drop-panel.mega{min-width:600px}
}
/* бургер до 960 — см. выше у .burger */
@media(max-width:960px){
  .nav-menu{max-height:calc(100vh - var(--nav-h));overflow-y:auto}
  /* в мобильном меню панели стоят в потоке: правила наведения и .open для компьютера
     сдвигали список языков на -50% влево, за край экрана */
  .nav-drop .drop-panel,.nav-drop:hover .drop-panel,.nav-drop:focus-within .drop-panel,.nav-drop.open .drop-panel,
  .nav-drop.dirs-drop:hover .drop-panel.mega,.nav-drop.dirs-drop:focus-within .drop-panel.mega{left:0;transform:none}
  .menu-open .asmo-agent{display:none}
  .drop-panel.mega{display:block;min-width:0;padding:0 0 0 8px}
  .drop-panel::before{display:none}
  .mega-col b{padding:10px 14px 4px}
  .mega-all{display:none !important}
  .lang-btn{padding:14px}
}
@media(max-width:760px){
  .stats-5,.stats{grid-template-columns:1fr 1fr}
  .stat{padding:20px 18px}
  .stat b{font-size:34px}
  .pgal{grid-template-columns:1fr 1fr;gap:12px}
  .partners{grid-template-columns:repeat(2,1fr)}
  .partners li{height:72px}
  .sz-row{grid-template-columns:1fr}
  .map-card{flex-direction:column;padding:26px}
  .dcard.dline{flex-wrap:wrap}
  .hero.hero-plain{padding:calc(var(--nav-h) + 40px) 0 48px}
  .split-body{padding:32px 24px}
  .faq details p{padding-right:0}
  .form-card{padding:26px 22px}
}

/* .split стоит на .wrap: рамка рисовалась по внешнему краю отступов, и между рамкой и фото
   оставалась белая полоса 24px — рамку переносим на сам блок */
.wrap.split{padding:0;width:calc(100% - 48px);max-width:calc(var(--wrap) - 48px)}

/* шапка: где держать кадр — на компьютере и отдельно на телефоне, где от широкого
   снимка видна узкая полоса (--pd/--pm ставит build.mjs, hero) */
.hero-media img{object-position:var(--pd,50% 50%)}
@media(max-width:760px){.hero-media img{object-position:var(--pm,var(--pd,50% 50%))}}

/* галерея из одного-двух снимков: не треть ряда с пустотой справа */
.pgal.n1{grid-template-columns:minmax(0,1fr);max-width:780px}
.pgal.n2{grid-template-columns:repeat(2,minmax(0,1fr))}

/* шапка с живым фото на телефоне и планшете: кадр 4:3 целиком отдельным блоком под текстом.
   Фоном под подложкой 78–88 % фото почти не было видно, а cover растягивал широкий
   кадр в 3–4 раза (замечание 11.10). На планшете (761–1100) фоном тоже нельзя: абзац
   шириной ~740 выходит за подложку, заданную в процентах ширины, и правая половина
   лежит на открытом фото — контраст 1,1–2,7 (второй круг 11.10). Граница 1100 стоит
   и в <source> в build.mjs (heroMedia); шире 800 блок не растёт — файл 1600 на
   экране с двойной плотностью без растяжения */
.hero-media picture{display:block;width:100%;height:100%}
@media(max-width:1100px){
  .hero.hero-live{flex-direction:column;align-items:stretch;min-height:0;padding:calc(var(--nav-h) + 36px) 0 76px}
  .hero-live .hero-media{position:relative;inset:auto;z-index:0;order:2;margin:28px 24px 0;aspect-ratio:4/3;max-width:800px;
    border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--line);background:var(--bg-2)}
  .hero-live .hero-media::after{display:none}
  .hero-live .hero-media img{object-position:50% 50%;animation:none;transform:none}
}
/* мелкий серый текст поверх фото в шапке не дотягивал до 4,5:1 — в светлой теме темнее */
:root:not([data-theme="dark"]) .hero:not(.hero-plain) .crumbs,
:root:not([data-theme="dark"]) .hero:not(.hero-plain) .hero-eyebrow .eyebrow{color:#4a4a52}
/* один вертикальный снимок в галерее — рамка 3:4, а не горизонтальная полоса */
.pgal.n1.tall{max-width:420px}
.pgal.tall .shot{aspect-ratio:3/4}

/* ---------- политика конфиденциальности /maxfiylik/ (12.10) ----------
   Оглавление слева липкое (на компьютере), на телефоне и планшете — списком над текстом. Текст — узкой колонкой,
   пары «ключ — значение» таблицей в две колонки, на телефоне — друг под другом */
.pol-meta{display:flex;flex-wrap:wrap;gap:8px}
.pol-meta span{padding:6px 14px;border-radius:999px;background:var(--chip);border:1px solid var(--chip-line);font-size:14px;color:var(--ink-2)}
.pol-meta b{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.pol-sec{padding:24px 0 96px}
.pol{display:grid;grid-template-columns:250px minmax(0,1fr);gap:56px;align-items:start}
.pol-toc{position:sticky;top:calc(var(--nav-h) + 24px);padding:18px 18px 12px;border-radius:var(--radius);background:var(--panel-2);border:1px solid var(--line)}
.pol-toc>b{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:8px}
.pol-toc ol{list-style:none;display:grid;gap:2px}
.pol-toc a{display:flex;gap:10px;padding:6px 8px;border-radius:8px;font-size:14px;line-height:1.35;color:var(--ink-2);text-decoration:none}
.pol-toc a span{font-variant-numeric:tabular-nums;color:var(--muted);min-width:20px}
.pol-toc a:hover,.pol-toc a:focus-visible{background:var(--chip);color:var(--ink)}
.pol-doc{max-width:780px}
.pol-brief{padding:24px 26px;border-radius:var(--radius);background:var(--cta-bg);color:var(--cta-ink);margin-bottom:24px}
.pol-brief h2{font-size:20px;margin:0 0 12px;color:var(--cta-ink)}
.pol-brief dl{display:grid;gap:10px}
.pol-brief div{display:grid;grid-template-columns:150px 1fr;gap:12px}
.pol-brief dt{font-weight:600}
.pol-brief dd{color:var(--cta-muted)}
.pol-s{padding:36px 0 8px;border-top:1px solid var(--line);scroll-margin-top:calc(var(--nav-h) + 16px)}
.pol-brief+.pol-s{border-top:0;padding-top:16px}
.pol-s h2{display:flex;gap:14px;align-items:baseline;font-size:clamp(22px,2.4vw,28px);letter-spacing:-.02em;margin:0 0 16px}
.pol-n{font-size:14px;font-weight:600;color:var(--muted);font-variant-numeric:tabular-nums;flex:none}
.pol-s p{color:var(--ink-2);margin:0 0 14px;font-size:15.5px;line-height:1.65}
.pol-dl{display:grid;margin:0 0 16px;border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden}
.pol-dl div{display:grid;grid-template-columns:200px 1fr;gap:16px;padding:14px 18px;border-top:1px solid var(--line)}
.pol-dl div:first-child{border-top:0}
.pol-dl dt{font-weight:600;font-size:14.5px;color:var(--ink)}
.pol-dl dd{font-size:15px;line-height:1.6;color:var(--ink-2)}
.pol-dl a,.pol-s p a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.pol-list{margin:0 0 16px 22px;display:grid;gap:8px;color:var(--ink-2);font-size:15.5px;line-height:1.6}
.pol-ed{font-size:14px;color:var(--muted)}
@media(max-width:1024px){
  .pol{grid-template-columns:minmax(0,1fr);gap:24px}
  .pol-toc{position:static}
  .pol-toc ol{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px}
}
@media(max-width:760px){
  .pol-sec{padding:8px 0 64px}
  .pol-toc ol{grid-template-columns:minmax(0,1fr)}
  .pol-brief{padding:20px 18px}
  .pol-brief div,.pol-dl div{grid-template-columns:minmax(0,1fr);gap:4px}
  .pol-dl div{padding:12px 14px}
}