/* site1111: /library («Отделы») and /companies («Готовые компании»), 11.11.2026. The site's own look: dark glass,
   tiles without frames, soft glows and motion; light theme by body.light (shared-nav.js) or html.s11-light before paint.
   The drawings are the cabinet's own (kit/art.js), so their plate stays light in both themes, as in the cabinet. */
.s11-page{ margin:0; background:#030712; color:#c8d6e5; font-family:'Inter',system-ui,sans-serif; overflow-x:hidden; }
.s11{ --ink:#fff; --tx:#d4e0ee; --tm:rgba(214,226,240,.8); --td:rgba(214,226,240,.58); --edge:rgba(255,255,255,.08); --edge2:rgba(255,255,255,.14);
  --panel:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.015)); --sh:0 30px 70px -34px rgba(0,0,0,.7);
  --ease:cubic-bezier(.2,.8,.2,1); --spring:cubic-bezier(.34,1.56,.64,1); --W:min(1120px,calc(100vw - 32px));
  position:relative; z-index:1; width:var(--W); margin:0 auto; padding:clamp(7rem,12vw,9rem) 0 4rem; }
.s11 *, .s11-sheet *{ box-sizing:border-box; }
.s11-sheet a{ text-decoration:none; color:inherit; }
.s11-sheet{ --ink:#fff; --edge2:rgba(255,255,255,.14); --ease:cubic-bezier(.2,.8,.2,1); --spring:cubic-bezier(.34,1.56,.64,1); }
.s11-sheet .rob .bulb{ animation:s11bulb 2.4s ease-in-out infinite; } .s11-sheet .ill .gnd{ opacity:.08; }
.s11 > section, .s11 > header{ padding:0; }   /* styles.css gives every section 7rem 2rem */
.s11 a{ text-decoration:none; color:inherit; }
.s11-bg{ position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.s11-bg i{ position:absolute; border-radius:50%; opacity:.5; animation:s11float 22s ease-in-out infinite alternate; }
.s11-bg .o1{ width:46vmax; height:46vmax; left:-12vmax; top:-14vmax; background:radial-gradient(circle,rgba(0,212,255,.22),transparent 62%); }
.s11-bg .o2{ width:40vmax; height:40vmax; right:-12vmax; top:20vh; background:radial-gradient(circle,rgba(139,92,246,.22),transparent 62%); animation-delay:-7s; }
.s11-bg .o3{ width:36vmax; height:36vmax; left:30vw; bottom:-18vmax; background:radial-gradient(circle,rgba(244,114,182,.14),transparent 62%); animation-delay:-13s; }
.s11-bg .gr{ inset:0; border-radius:0; filter:none; opacity:1; animation:none; background-image:linear-gradient(rgba(120,160,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(120,160,255,.05) 1px,transparent 1px);
  background-size:56px 56px; -webkit-mask-image:radial-gradient(ellipse 80% 55% at 50% 0%,#000 10%,transparent 75%); mask-image:radial-gradient(ellipse 80% 55% at 50% 0%,#000 10%,transparent 75%); }
@keyframes s11float{ to{ transform:translate(4vmax,3vmax) scale(1.08); } }

/* hero */
.s11-hero{ max-width:820px; }
.s11-k{ display:inline-flex; align-items:center; gap:.6rem; margin:0 0 1rem; font:600 .76rem/1 'Inter',sans-serif; letter-spacing:.24em; text-transform:uppercase; color:#7fe7ff; }
.s11-k i{ width:8px; height:8px; border-radius:50%; background:#22d3ee; box-shadow:0 0 12px #22d3ee; animation:s11dot 1.8s ease-in-out infinite; }
@keyframes s11dot{ 50%{ opacity:.35; transform:scale(.7); } }
.s11-h1{ margin:0; font:700 clamp(2.2rem,5.4vw,4rem)/1.03 'Space Grotesk',sans-serif; letter-spacing:-.03em; color:var(--ink); }
.s11-grad{ background:linear-gradient(100deg,#00d4ff 0%,#3b82f6 45%,#8b5cf6 75%,#f472b6 100%); background-size:220% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:s11shine 9s ease-in-out infinite alternate; }
@keyframes s11shine{ to{ background-position:100% 0; } }
.s11-lead{ margin:1.1rem 0 0; max-width:640px; font-size:clamp(1rem,1.4vw,1.15rem); line-height:1.6; color:var(--tm); }

/* reveal */
.s11 [data-rv]{ opacity:0; transform:translateY(24px); transition:opacity .8s var(--ease) var(--d,0s), transform .9s var(--ease) var(--d,0s); }
.s11 [data-rv].in{ opacity:1; transform:none; }

/* the cabinet drawing: a light plate with the department colour, the building, the head and the team in front */
.s11-pic{ position:relative; display:block; aspect-ratio:240/170; border-radius:20px; overflow:hidden; isolation:isolate;
  background:linear-gradient(170deg,color-mix(in srgb,var(--c) 22%,#f8fbff) 0%,#f3f7fd 55%,color-mix(in srgb,var(--c) 10%,#eef3fa) 100%); }
.s11-glow{ position:absolute; left:50%; top:46%; width:80%; height:70%; transform:translate(-50%,-50%); z-index:-1; border-radius:50%;
  background:radial-gradient(circle,color-mix(in srgb,var(--c) 35%,transparent),transparent 65%); animation:s11breathe 4.6s ease-in-out infinite; }
@keyframes s11breathe{ 50%{ transform:translate(-50%,-50%) scale(1.12); opacity:.75; } }
.s11-obj{ position:absolute; left:6%; right:6%; top:2%; }
.s11-obj svg{ display:block; width:100%; height:auto; }
.s11-crew{ position:absolute; left:50%; bottom:4%; transform:translateX(-50%); display:flex; align-items:flex-end; gap:0; }
.s11-rb{ display:block; width:30px; margin-left:-6px; animation:s11bob 2.8s calc(var(--k,0) * .22s) ease-in-out infinite; }
.s11-rb:first-child{ margin-left:0; }
.s11-rb svg{ display:block; width:100%; height:auto; overflow:visible; }
.s11-rb.s11-hd{ width:40px; z-index:2; animation-duration:3.2s; }
.s11-crew em{ align-self:center; margin-left:4px; padding:2px 7px; border-radius:999px; font:700 .7rem/1.3 'Inter',sans-serif; font-style:normal; color:#0b1222; background:rgba(255,255,255,.9); box-shadow:0 2px 8px rgba(15,23,42,.15); }
@keyframes s11bob{ 50%{ transform:translateY(-3px); } }
.s11 .rob .bulb{ animation:s11bulb 2.4s ease-in-out infinite; }
@keyframes s11bulb{ 50%{ opacity:.35; } }
.s11 .ill .gnd{ opacity:.08; }

/* /library: groups, a grid of two columns everywhere */
.s11-grp{ margin-top:clamp(2.6rem,5vw,3.6rem); }
.s11-gh{ margin:0 0 1rem; font:600 .8rem/1.2 'Inter',sans-serif; letter-spacing:.18em; text-transform:uppercase; color:var(--td); }
.s11-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(.7rem,1.6vw,1.2rem); }
@media (min-width:900px){ .s11-grid{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.s11-tile{ position:relative; display:flex; flex-direction:column; gap:.7rem; padding:.6rem .6rem 1rem; border-radius:24px; background:var(--panel);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), inset 0 0 0 1px var(--edge), var(--sh); -webkit-tap-highlight-color:transparent;
  transition:transform .45s var(--spring), box-shadow .45s; }
.s11-tile:hover{ transform:translateY(-5px); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 55%,transparent), 0 26px 60px -30px var(--c); }
.s11-tile:active{ transform:scale(.97); }
.s11-tt{ display:flex; flex-direction:column; gap:.25rem; padding:0 .4rem; min-width:0; }
.s11-tt b{ font:700 1.08rem/1.2 'Space Grotesk',sans-serif; color:var(--ink); letter-spacing:-.01em; }
.s11-tt span{ font-size:.86rem; line-height:1.4; color:var(--tm); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.s11-tt small{ display:inline-flex; align-items:center; gap:.4rem; margin-top:.25rem; font-size:.76rem; font-weight:600; color:var(--td); }
.s11-tt small i{ width:7px; height:7px; border-radius:50%; background:var(--c); box-shadow:0 0 8px var(--c); }

/* cross link */
.s11-cross{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.6rem 1.2rem; margin-top:3rem; padding:1.4rem 1.6rem; border-radius:22px;
  background:linear-gradient(120deg,rgba(0,212,255,.12),rgba(139,92,246,.14)); box-shadow:inset 0 0 0 1px rgba(127,231,255,.25); transition:transform .4s var(--spring); }
.s11-cross:hover{ transform:translateY(-3px); }
.s11-cross span{ font-size:1.02rem; color:var(--tx); }
.s11-cross b{ display:inline-flex; align-items:center; gap:.35rem; font:700 1.05rem/1 'Space Grotesk',sans-serif; color:#7fe7ff; }
.s11-chev{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; flex:none; transition:transform .3s var(--spring); }
a:hover > .s11-chev, a:hover b .s11-chev{ transform:translateX(3px); }

/* buttons */
.s11-btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; height:52px; padding:0 1.4rem; border-radius:15px; font:700 1rem/1 'Inter',sans-serif; cursor:pointer; transition:transform .35s var(--spring), box-shadow .35s, background .3s; }
.s11-btn.main{ position:relative; overflow:hidden; color:#fff; background:linear-gradient(120deg,#00c6f7,#3b82f6 55%,#7c5cf6); box-shadow:0 14px 36px -12px rgba(0,180,255,.7), inset 0 1px 0 rgba(255,255,255,.35); }
.s11-btn.main::after{ content:""; position:absolute; inset:0; background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.4) 50%,transparent 70%); transform:translateX(-120%); animation:s11sweep 4.2s 1.2s ease-in-out infinite; }
@keyframes s11sweep{ 0%,62%{ transform:translateX(-120%); } 82%,100%{ transform:translateX(120%); } }
.s11-btn.main:hover{ transform:translateY(-2px); }
.s11-btn.ghost{ color:var(--ink); background:rgba(255,255,255,.06); box-shadow:inset 0 0 0 1px var(--edge2); }
.s11-btn.ghost:hover{ background:rgba(255,255,255,.1); }

/* tags */
.s11-tag{ display:inline-flex; align-items:center; align-self:flex-start; height:24px; padding:0 .65rem; border-radius:999px; font:700 .68rem/1 'Inter',sans-serif; letter-spacing:.08em; text-transform:uppercase; white-space:nowrap; }
.s11-tag.o, .s11-tag.one{ color:#7fe7ff; background:rgba(0,212,255,.12); }
.s11-tag.i, .s11-tag.mai{ color:#d8b4fe; background:rgba(168,85,247,.16); }
.s11-tag.hd{ margin-left:.45rem; height:20px; font-size:.6rem; color:#fde68a; background:rgba(251,191,36,.14); vertical-align:2px; }

/* /companies: cards */
.s11-cogrid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.2rem; margin-top:clamp(2.4rem,5vw,3.4rem); }
.s11-co{ position:relative; display:flex; flex-direction:column; gap:1rem; padding:.7rem .7rem 1.2rem; border-radius:28px; background:var(--panel);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), inset 0 0 0 1px var(--edge), var(--sh); transition:transform .45s var(--spring), box-shadow .45s; }
.s11-co:hover{ transform:translateY(-5px); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 55%,transparent), 0 30px 70px -34px var(--c); }
.s11-co-a{ display:flex; flex-direction:column; gap:1rem; -webkit-tap-highlight-color:transparent; }
.s11-co .s11-pic{ aspect-ratio:240/150; }
.s11-co .s11-rb{ width:36px; } .s11-co .s11-rb.s11-hd{ width:48px; }
.s11-co-tx{ display:flex; flex-direction:column; gap:.45rem; padding:0 .6rem; }
.s11-co-tx b{ font:700 1.5rem/1.15 'Space Grotesk',sans-serif; color:var(--ink); letter-spacing:-.02em; }
.s11-co-d{ font-size:.88rem; font-weight:600; color:var(--td); }
.s11-co-p{ font-size:.98rem; line-height:1.55; color:var(--tm); }
.s11-chs{ display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.2rem; }
.s11-ch{ height:28px; display:inline-flex; align-items:center; padding:0 .7rem; border-radius:999px; font-size:.8rem; font-weight:600; color:var(--tx); background:rgba(255,255,255,.06); box-shadow:inset 0 0 0 1px var(--edge2); }
.s11-co-more{ display:inline-flex; align-items:center; gap:.3rem; margin-top:.3rem; font-weight:700; font-size:.95rem; color:#7fe7ff; }
.s11-co-go{ margin:0 .6rem; }
@media (min-width:701px){
  .s11-co:last-child:nth-child(odd){ grid-column:1 / -1; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; column-gap:1.4rem; }
  .s11-co:last-child:nth-child(odd) .s11-co-a{ display:contents; }
  .s11-co:last-child:nth-child(odd) .s11-pic{ grid-row:1 / 3; }
  .s11-co:last-child:nth-child(odd) .s11-co-go{ grid-column:2; align-self:start; }
}

/* the sheet: a bottom sheet on the phone, a centred panel on the computer */
.s11-sheet{ position:fixed; inset:0; z-index:10050; display:flex; align-items:flex-end; justify-content:center; }
.s11-sheet[hidden]{ display:none; }
.s11-sh-bd{ position:absolute; inset:0; background:rgba(2,6,18,.62); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); opacity:0; transition:opacity .35s; }
.s11-sh{ position:relative; width:min(760px,100%); max-height:92svh; overflow:auto; overscroll-behavior:contain; border-radius:28px 28px 0 0; outline:none;
  background:linear-gradient(180deg,#0e1730,#070d1f 60%); box-shadow:inset 0 1px 0 rgba(255,255,255,.12), 0 -30px 80px -20px rgba(0,0,0,.7);
  transform:translateY(100%); transition:transform .5s var(--ease); padding:1.1rem 1.1rem calc(1.6rem + env(safe-area-inset-bottom)); }
.s11-sheet.on .s11-sh-bd{ opacity:1; } .s11-sheet.on .s11-sh{ transform:none; }
@media (min-width:820px){ .s11-sheet{ align-items:center; } .s11-sh{ border-radius:28px; max-height:88vh; padding:1.4rem 1.6rem 1.8rem; transform:translateY(30px) scale(.97); opacity:0; transition:transform .45s var(--ease), opacity .35s; }
  .s11-sheet.on .s11-sh{ opacity:1; } }
.s11-x{ position:sticky; top:0; float:right; z-index:3; width:42px; height:42px; margin:-.2rem -.2rem 0 0; border:0; border-radius:50%; cursor:pointer; display:grid; place-items:center; color:#fff;
  background:rgba(255,255,255,.1); box-shadow:inset 0 0 0 1px rgba(255,255,255,.16); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
.s11-x svg{ width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; }
.s11-sh-in{ display:flex; flex-direction:column; gap:1.1rem; color:#c8d6e5; }
.s11-sh-top{ display:grid; grid-template-columns:minmax(0,220px) 1fr; gap:1.1rem; align-items:center; padding-right:2.6rem; }
.s11-sh-top .s11-pic{ aspect-ratio:240/170; }
.s11-sh-h{ display:flex; flex-direction:column; gap:.5rem; }
.s11-sh-h h2{ margin:0; font:700 clamp(1.5rem,3vw,2rem)/1.1 'Space Grotesk',sans-serif; color:#fff; letter-spacing:-.02em; }
.s11-line{ margin:0; color:rgba(200,214,229,.72); line-height:1.5; }
.s11-blk{ padding:1.1rem 1.15rem; border-radius:20px; background:rgba(255,255,255,.04); box-shadow:inset 0 0 0 1px rgba(255,255,255,.07); }
.s11-blk h3{ margin:0 0 .7rem; font:700 1.05rem/1.2 'Space Grotesk',sans-serif; color:#fff; }
.s11-blk h3 em{ font-style:normal; font-weight:600; font-size:.82rem; color:rgba(200,214,229,.5); margin-left:.4rem; }
.s11-blk p{ margin:0; line-height:1.6; color:rgba(200,214,229,.8); }
.s11-ags{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.55rem; }
.s11-ag{ display:grid; grid-template-columns:40px 1fr; gap:.8rem; align-items:start; padding:.6rem .7rem; border-radius:16px; background:rgba(255,255,255,.035); }
.s11-ag-hd{ background:linear-gradient(120deg,rgba(251,191,36,.1),rgba(255,255,255,.03)); box-shadow:inset 0 0 0 1px rgba(251,191,36,.18); }
.s11-ag-rb svg{ display:block; width:40px; height:auto; }
.s11-ag-tx{ display:flex; flex-direction:column; gap:.2rem; min-width:0; }
.s11-ag-tx b{ font-size:.98rem; color:#fff; }
.s11-ag-tx > span{ font-size:.88rem; line-height:1.5; color:rgba(200,214,229,.72); }
.s11-where{ align-self:flex-start; margin-top:.15rem; font-size:.72rem; font-weight:700; letter-spacing:.04em; padding:2px 8px; border-radius:999px; }
.s11-where.o{ color:#7fe7ff; background:rgba(0,212,255,.1); } .s11-where.i{ color:#d8b4fe; background:rgba(168,85,247,.12); }
.s11-caps{ display:grid; grid-template-columns:auto 1fr; gap:1rem; align-items:center; background:linear-gradient(120deg,rgba(0,212,255,.12),rgba(139,92,246,.14)); box-shadow:inset 0 0 0 1px rgba(127,231,255,.25); }
.s11-caps-ic{ width:56px; height:56px; border-radius:18px; display:grid; place-items:center; background:rgba(0,212,255,.1); color:#7fe7ff; }
/* site1211: the whole mark turns (the ring is round, so it looks the same) and its glow is drawn once, not every frame */
.s11-mark{ width:34px; height:34px; filter:drop-shadow(0 0 10px rgba(0,212,255,.7)); animation:s11spin 18s linear infinite; }
@keyframes s11spin{ to{ transform:rotate(360deg); } }
.s11-caps h3{ margin-bottom:.35rem; }
.s11-acts{ display:flex; flex-wrap:wrap; gap:.6rem; }
.s11-acts .s11-btn{ flex:1 1 220px; }
.s11-note{ margin:-.2rem 0 0; font-size:.84rem; color:rgba(200,214,229,.55); text-align:center; }
.s11-dpt + .s11-dpt{ margin-top:1rem; }
.s11-dpt h4{ display:flex; align-items:center; gap:.5rem; margin:0 0 .55rem; font:700 .95rem/1.2 'Space Grotesk',sans-serif; color:#fff; }
.s11-dpt h4 i{ width:10px; height:10px; border-radius:50%; background:var(--c); box-shadow:0 0 10px var(--c); }
.s11-dpt h4 em{ font-style:normal; font-weight:600; font-size:.8rem; color:rgba(200,214,229,.5); }

/* who talks to whom: a vertical line, light runs down it */
.s11-flow{ position:relative; list-style:none; margin:0; padding:0 0 0 0; display:flex; flex-direction:column; gap:.55rem; }
.s11-flow::before{ content:""; position:absolute; left:27px; top:28px; bottom:28px; width:2px; background:linear-gradient(rgba(0,212,255,.5),rgba(139,92,246,.5)); }
.s11-flow::after{ content:""; position:absolute; left:23px; top:28px; width:10px; height:10px; border-radius:50%; background:#7fe7ff; box-shadow:0 0 14px #22d3ee; animation:s11run 4.5s ease-in-out infinite; }
@keyframes s11run{ 0%{ transform:translateY(0); opacity:0; } 10%{ opacity:1; } 90%{ opacity:1; } 100%{ transform:translateY(calc(var(--fh,260px) - 56px)); opacity:0; } }
.s11-flow li{ position:relative; display:grid; grid-template-columns:56px 1fr; gap:.8rem; align-items:center; }
.s11-fl-ic{ position:relative; z-index:1; width:56px; min-height:56px; border-radius:18px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:2px; padding:4px;
  background:#0d1630; box-shadow:inset 0 0 0 1px rgba(255,255,255,.12); }
.s11-fl-ic .s11-rb.sm{ width:22px; margin:0; animation:none; }
.s11-fl-ic.cl i{ font-style:normal; font-size:.5rem; font-weight:700; line-height:1.15; color:#7fe7ff; padding:1px 3px; border-radius:4px; background:rgba(0,212,255,.1); max-width:48px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.s11-fl-ic.mai{ color:#7fe7ff; } .s11-fl-ic.mai .s11-mark{ width:30px; height:30px; }
.s11-fl-ic.you i{ width:26px; height:26px; border-radius:50%; background:radial-gradient(circle at 35% 30%,#fde68a,#f59e0b); box-shadow:0 0 14px rgba(251,191,36,.6); }
.s11-flow li > span:last-child{ display:flex; flex-direction:column; gap:.15rem; min-width:0; }
.s11-flow b{ color:#fff; font-size:.98rem; }
.s11-flow small{ font-size:.86rem; line-height:1.45; color:rgba(200,214,229,.72); }

/* phone */
@media (max-width:700px){
  .s11{ padding-top:6.4rem; }
  .s11-tile{ padding:.45rem .45rem .8rem; border-radius:20px; gap:.55rem; }
  .s11-pic{ border-radius:16px; }
  .s11-rb{ width:22px; margin-left:-5px; } .s11-rb.s11-hd{ width:30px; }
  .s11-tt{ padding:0 .3rem; } .s11-tt b{ font-size:.95rem; } .s11-tt span{ font-size:.78rem; } .s11-tt small{ font-size:.7rem; }
  .s11-crew em{ font-size:.6rem; padding:1px 5px; }
  .s11-cogrid{ grid-template-columns:1fr; gap:.9rem; }
  .s11-co-tx b{ font-size:1.3rem; }
  .s11-sh-top{ grid-template-columns:1fr; padding-right:0; }
  .s11-sh-top .s11-pic{ max-width:none; }
  .s11-sh{ padding:.9rem .85rem calc(1.4rem + env(safe-area-inset-bottom)); }
  .s11-blk{ padding:.95rem .9rem; }
  .s11-x{ position:absolute; top:.9rem; right:.9rem; float:none; margin:0; background:rgba(3,7,18,.55); }
  .s11-cross{ padding:1.1rem 1.2rem; }
  .s11-cross b{ font-size:1rem; }
}
@media (prefers-reduced-motion:reduce){
  .s11-bg i, .s11-glow, .s11-rb, .s11 .rob .bulb, .s11-grad, .s11-btn.main::after, .s11-mark, .s11-flow::after{ animation:none !important; }
  .s11 [data-rv]{ opacity:1; transform:none; transition:none; }
}

/* light theme */
html.s11-light .s11-page, body.light.s11-page{ background:#f3f6fb; color:#334155; }
html.s11-light .s11, body.light .s11{ --ink:#0b1222; --tx:#334155; --tm:#5b6b80; --td:#94a3b8; --edge:rgba(15,23,42,.07); --edge2:rgba(15,23,42,.12);
  --panel:linear-gradient(180deg,#ffffff,#f7f9fd); --sh:0 24px 60px -32px rgba(15,23,42,.28); }
html.s11-light .s11-bg i, body.light .s11-bg i{ opacity:.25; }
html.s11-light .s11-k, body.light .s11-k{ color:#0284c7; }
html.s11-light .s11-cross b, body.light .s11-cross b, html.s11-light .s11-co-more, body.light .s11-co-more{ color:#0369a1; }
html.s11-light .s11-cross, body.light .s11-cross{ background:linear-gradient(120deg,#e0f7ff,#efe9ff); box-shadow:inset 0 0 0 1px rgba(2,132,199,.18); }
html.s11-light .s11-ch, body.light .s11-ch, html.s11-light .s11-btn.ghost, body.light .s11-btn.ghost{ background:#fff; }
html.s11-light .s11-tag.o, body.light .s11-tag.o, html.s11-light .s11-tag.one, body.light .s11-tag.one{ color:#0369a1; background:#e0f2fe; }
html.s11-light .s11-tag.i, body.light .s11-tag.i, html.s11-light .s11-tag.mai, body.light .s11-tag.mai{ color:#6d28d9; background:#ede9fe; }
/* Thai, Chinese and Armenian: no wide letter spacing in the small capitals (it tore Thai words apart) */
html[lang="th"] .s11-k, html[lang="zh"] .s11-k, html[lang="hy"] .s11-k, html[lang="th"] .s11-tag, html[lang="zh"] .s11-tag, html[lang="th"] .s11-gh, html[lang="zh"] .s11-gh{ letter-spacing:.02em; }

/* ===== round 2 (11.11): the hero aside, signs on the pictures, the closing block, the agent's bubble ===== */
.s11-nw{ white-space:nowrap; }
.s11-hero2{ max-width:none; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:clamp(1.5rem,4vw,3.5rem); align-items:end; }
.s11-hero-t{ max-width:720px; }
.s11-aside{ position:relative; padding:1.4rem 1.5rem 1.5rem; border-radius:26px; overflow:hidden; isolation:isolate;
  background:linear-gradient(150deg,rgba(0,212,255,.14),rgba(15,23,42,.55) 50%,rgba(139,92,246,.18)); box-shadow:inset 0 0 0 1px rgba(127,231,255,.28), 0 30px 80px -34px rgba(0,180,255,.45); }
.s11-aside::after{ content:""; position:absolute; right:-30%; top:-40%; width:80%; height:120%; z-index:-1; background:radial-gradient(closest-side,rgba(0,212,255,.18),transparent); animation:s11breathe 6s ease-in-out infinite; }
.s11-as-top{ display:flex; align-items:center; gap:.9rem; margin-bottom:1rem; }
.s11-as-mk{ width:52px; height:52px; flex:none; border-radius:16px; display:grid; place-items:center; color:#7fe7ff; background:rgba(0,212,255,.1); box-shadow:inset 0 0 0 1px rgba(0,212,255,.3); }
.s11-as-row{ display:flex; align-items:flex-end; gap:.35rem; }
.s11-as-b{ position:relative; display:block; }
.s11-as-b .s11-rb{ width:34px; margin:0; }
.s11-bub{ position:absolute; right:-6px; top:-8px; width:16px; height:12px; border-radius:6px 6px 6px 2px; background:#fff; opacity:0; transform:scale(.4); transform-origin:0 100%;
  animation:s11bub 5s calc(var(--k) * 1s) ease-in-out infinite; }
.s11-bub::after{ content:""; position:absolute; left:3px; right:3px; top:5px; height:2px; border-radius:1px; background:#0b1222; opacity:.45; }
@keyframes s11bub{ 0%,4%{ opacity:0; transform:scale(.4); } 9%,22%{ opacity:1; transform:scale(1); } 28%,100%{ opacity:0; transform:scale(.4); } }
.s11-as-k{ margin:0 0 .35rem; font:600 .72rem/1 'Inter',sans-serif; letter-spacing:.2em; text-transform:uppercase; color:#7fe7ff; }
.s11-aside h2{ margin:0 0 .45rem; font:700 clamp(1.35rem,2.2vw,1.7rem)/1.15 'Space Grotesk',sans-serif; color:var(--ink); letter-spacing:-.02em; }
.s11-aside p{ margin:0; color:var(--tx); line-height:1.55; }
.s11-as-m{ display:flex; align-items:center; gap:.55rem; margin-top:.8rem !important; padding-top:.8rem; border-top:1px solid rgba(255,255,255,.1); font-weight:600; font-size:.92rem; color:#c4f1ff !important; }
.s11-as-m i{ width:9px; height:9px; flex:none; border-radius:50%; background:conic-gradient(#f0916b,#8ab4ff,#e6e9ee,#7dd3fc,#f0916b); box-shadow:0 0 10px rgba(125,211,252,.8); animation:s11spin 6s linear infinite; }

/* the department's own sign on its picture */
.s11-sign{ position:absolute; left:8px; top:8px; z-index:2; width:30px; height:30px; border-radius:10px; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 55%,#0b1226)); box-shadow:0 6px 16px -6px var(--c), inset 0 1px 0 rgba(255,255,255,.35); }
.s11-sign svg{ width:17px; height:17px; fill:none; stroke:#fff; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.s11-sh-top .s11-sign, .s11-co .s11-sign{ width:38px; height:38px; border-radius:12px; left:12px; top:12px; } .s11-sh-top .s11-sign svg, .s11-co .s11-sign svg{ width:21px; height:21px; }

/* the closing block */
.s11 > .s11-cta, .s11-cta{ position:relative; display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:1.5rem; align-items:center; margin-top:clamp(3rem,6vw,4.5rem);
  padding:clamp(1.5rem,3.4vw,2.6rem); border-radius:30px; overflow:hidden; isolation:isolate;
  background:linear-gradient(125deg,#0a2a44 0%,#14183a 55%,#2a1446 100%); box-shadow:inset 0 0 0 1px rgba(127,231,255,.26), 0 40px 90px -40px rgba(0,180,255,.5); }
.s11-cta-glow{ position:absolute; inset:-40% -10% auto auto; width:70%; height:160%; z-index:-1; background:radial-gradient(closest-side,rgba(0,212,255,.22),transparent); animation:s11breathe 7s ease-in-out infinite; }
.s11-cta h2{ margin:0 0 .6rem; font:700 clamp(1.6rem,3vw,2.3rem)/1.1 'Space Grotesk',sans-serif; color:#fff; letter-spacing:-.02em; }
.s11-cta p{ margin:0; max-width:560px; color:rgba(220,232,246,.82); line-height:1.6; font-size:1.02rem; }
.s11-cta-b{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.4rem; }
.s11-cta-b .s11-btn.ghost{ color:#fff; background:rgba(255,255,255,.08); box-shadow:inset 0 0 0 1px rgba(255,255,255,.2); }
.s11-live{ width:9px; height:9px; border-radius:50%; background:#34d399; box-shadow:0 0 0 0 rgba(52,211,153,.6); animation:s11ping 2s infinite; }
@keyframes s11ping{ 0%{ box-shadow:0 0 0 0 rgba(52,211,153,.55); } 70%{ box-shadow:0 0 0 9px rgba(52,211,153,0); } 100%{ box-shadow:0 0 0 0 rgba(52,211,153,0); } }
.s11-cta-v{ display:flex; flex-direction:column; align-items:center; gap:1rem; }
.s11-cta-mk{ width:84px; height:84px; border-radius:26px; display:grid; place-items:center; color:#7fe7ff; background:rgba(0,212,255,.1); box-shadow:inset 0 0 0 1px rgba(0,212,255,.3), 0 0 40px -10px rgba(0,212,255,.6); }
.s11-cta-mk .s11-mark{ width:48px; height:48px; }
.s11-cta-row{ display:flex; gap:.5rem; } .s11-cta-row .s11-rb{ width:40px; margin:0; }

/* tap an agent: a bubble with its role */
.s11-ag{ position:relative; cursor:pointer; transition:transform .3s var(--spring,ease), background .25s; -webkit-tap-highlight-color:transparent; }
.s11-ag:hover{ background:rgba(255,255,255,.06); } .s11-ag:active{ transform:scale(.985); }
.s11-ag-rb{ position:relative; }
.s11-say{ position:absolute; left:34px; top:-30px; z-index:3; width:max-content; max-width:min(260px,64vw); padding:.45rem .7rem; border-radius:12px 12px 12px 3px; font-size:.82rem; font-weight:600; line-height:1.35;
  color:#0b1222; background:#fff; box-shadow:0 10px 24px -8px rgba(0,0,0,.5); transform-origin:0 100%; animation:s11say .35s var(--spring,ease) both; pointer-events:none; }
@keyframes s11say{ from{ opacity:0; transform:scale(.6) translateY(6px); } to{ opacity:1; transform:none; } }

/* stagger and press on the tiles */
.s11-tile[data-rv]{ transform:translateY(26px) scale(.98); }
.s11-tile[data-rv].in{ transform:none; }

@media (max-width:900px){
  .s11-hero2{ grid-template-columns:1fr; }
  .s11-cta{ grid-template-columns:1fr; }
  .s11-cta-v{ flex-direction:row; justify-content:flex-start; order:-1; }
  .s11-cta-mk{ width:60px; height:60px; border-radius:18px; } .s11-cta-mk .s11-mark{ width:34px; height:34px; }
  .s11-cta-row .s11-rb{ width:32px; }
}
@media (max-width:700px){
  .s11-aside{ padding:1.1rem 1.1rem 1.2rem; border-radius:22px; }
  .s11-as-b .s11-rb{ width:28px; }
  .s11-sign{ width:24px; height:24px; border-radius:8px; left:6px; top:6px; } .s11-sign svg{ width:14px; height:14px; }
  .s11-cta-b .s11-btn{ flex:1 1 100%; }
}
@media (prefers-reduced-motion:reduce){ .s11-bub, .s11-as-m i, .s11-cta-glow, .s11-aside::after, .s11-live, .s11-say{ animation:none !important; } .s11-bub{ opacity:0; } }
html.s11-light .s11-aside, body.light .s11-aside{ background:linear-gradient(150deg,#e0f7ff,#ffffff 50%,#f1ebff); box-shadow:inset 0 0 0 1px rgba(2,132,199,.2), 0 24px 60px -30px rgba(2,132,199,.35); }
html.s11-light .s11-as-m, body.light .s11-as-m{ color:#0369a1 !important; border-top-color:rgba(15,23,42,.1); }
html.s11-light .s11-as-k, body.light .s11-as-k{ color:#0284c7; }

/* round 2b: chapters, the wide featured card, hero actions, the closing block on the phone, readable small text */
.s11-gh{ display:flex; align-items:center; gap:.6rem; font-size:.86rem; color:var(--tx); }
.s11-gh i{ width:22px; height:2px; border-radius:2px; background:linear-gradient(90deg,#22d3ee,#8b5cf6); }
.s11-gh em{ font-style:normal; font-weight:700; font-size:.78rem; color:var(--td); padding:2px 8px; border-radius:999px; background:rgba(255,255,255,.06); letter-spacing:0; }
.s11-grp:first-of-type{ margin-top:clamp(2.2rem,4vw,3rem); }
.s11-wide{ grid-column:span 2; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); align-items:center; gap:1rem; }
.s11-wide .s11-tt b{ font-size:1.3rem; } .s11-wide .s11-tt span{ -webkit-line-clamp:3; }
.s11-hacts{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.6rem; }
.s11-hacts .s11-btn{ height:54px; }
.s11 > .s11-cta{ padding:clamp(1.5rem,3.4vw,2.6rem); }
@media (max-width:900px){ .s11 > .s11-cta{ grid-template-columns:1fr; } }
@media (max-width:700px){
  .s11-k{ font-size:.8rem; }
  .s11-tt span{ font-size:.86rem; } .s11-tt small{ font-size:.8rem; }
  .s11-wide{ grid-template-columns:1fr 1fr; gap:.6rem; } .s11-wide .s11-tt b{ font-size:1.05rem; } .s11-wide .s11-tt span{ -webkit-line-clamp:4; }
  .s11-hacts .s11-btn{ flex:1 1 100%; }
  .s11-cta-row{ display:none; }
  .s11-cta-v{ order:-1; }
  .s11-crew em{ font-size:.7rem; }
}
/* the aside assembles: Mai first, then the agents one by one */
.s11-aside .s11-as-b{ opacity:0; transform:translateY(10px) scale(.8); transition:opacity .5s, transform .6s var(--spring); transition-delay:calc(.35s + var(--k) * .12s); }
.s11-aside.in .s11-as-b{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .s11-aside .s11-as-b{ opacity:1; transform:none; transition:none; } }

/* round 2c: a quiet hero link on /companies, buttons keep their words on one line, readable tags on the phone */
.s11-hlink{ display:inline-flex; align-items:center; gap:.5rem; height:48px; padding:0 1.1rem; border-radius:14px; font-weight:700; color:#7fe7ff; background:rgba(0,212,255,.08); box-shadow:inset 0 0 0 1px rgba(0,212,255,.28); }
.s11-hlink:hover{ background:rgba(0,212,255,.14); }
.s11-btn{ white-space:nowrap; }
@media (max-width:700px){
  .s11-btn{ font-size:.95rem; padding:0 1rem; }
  .s11-tag{ font-size:.76rem; height:26px; }
  .s11-as-k{ font-size:.8rem; }
  .s11-ch{ font-size:.86rem; }
  .s11-co-d{ font-size:.9rem; }
}
html.s11-light .s11-hlink, body.light .s11-hlink{ color:#0369a1; background:#e0f2fe; }

/* round 3: channels and knowledge per agent, the department's tools, the cycle under the buttons */
.s11-agch{ display:flex; flex-wrap:wrap; align-items:center; gap:.3rem; margin-top:.3rem; }
.s11-agch em{ font-style:normal; font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:rgba(200,214,229,.5); margin-right:.15rem; }
.s11-agch i{ font-style:normal; font-size:.76rem; font-weight:600; color:#d4e0ee; padding:2px 8px; border-radius:999px; background:rgba(255,255,255,.07); }
.s11-kb{ display:block; margin-top:.4rem; padding:.45rem .6rem; border-radius:10px; font-size:.82rem; color:#d4e0ee; background:rgba(251,191,36,.08); box-shadow:inset 0 0 0 1px rgba(251,191,36,.18); }
.s11-kb b{ color:#fde68a; margin-right:.2rem; } .s11-kb-t{ display:block; margin-top:.2rem; color:rgba(212,224,238,.7); }
.s11-tl-p{ margin:-.3rem 0 .7rem !important; font-size:.9rem; }
.s11-tls{ display:flex; flex-wrap:wrap; gap:.4rem; }
.s11-tl{ display:inline-flex; align-items:center; height:32px; padding:0 .8rem; border-radius:10px; font-size:.86rem; font-weight:600; color:#e2ecf7;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03)); box-shadow:inset 0 0 0 1px rgba(255,255,255,.1); }
.s11-cyc{ list-style:none; margin:.2rem 0 0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.4rem; }
.s11-cyc li{ position:relative; display:flex; flex-direction:column; gap:.35rem; padding:.6rem .6rem .65rem; border-radius:14px; font-size:.82rem; line-height:1.3; color:#d4e0ee; background:rgba(255,255,255,.04); }
.s11-cyc i{ width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font-style:normal; font-weight:800; font-size:.72rem; color:#04121c; background:linear-gradient(135deg,#4dd6ff,#818cf8); }
.s11-cyc li:last-child{ background:rgba(16,185,129,.1); box-shadow:inset 0 0 0 1px rgba(16,185,129,.25); } .s11-cyc li:last-child i{ background:#10b981; color:#fff; }
@media (max-width:560px){ .s11-cyc{ grid-template-columns:1fr 1fr; } }

/* ===== site1211 (owner 11.11 12:31) ===== */
/* the department / company tiles: a neon see-through tint of the department's own colour, a glow (never the blue ring) */
.s11-tile{ outline:none; background:linear-gradient(165deg,color-mix(in srgb,var(--c) 30%,transparent) 0%,color-mix(in srgb,var(--c) 9%,transparent) 72%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), inset 0 0 0 1px color-mix(in srgb,var(--c) 34%,transparent), 0 20px 44px -28px color-mix(in srgb,var(--c) 75%,transparent); }
.s11-tile:focus{ outline:none; }
.s11-tile:hover, .s11-tile:focus-visible, .s11-tile:active, .s11-tile.s11-sel{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 1px color-mix(in srgb,var(--c) 70%,transparent), 0 0 0 3px color-mix(in srgb,var(--c) 22%,transparent), 0 0 38px -4px color-mix(in srgb,var(--c) 70%,transparent); }
.s11-tt small i{ box-shadow:0 0 10px var(--c); }
html.s11-light .s11-tile, body.light .s11-tile{ background:linear-gradient(165deg,color-mix(in srgb,var(--c) 22%,#fff) 0%,color-mix(in srgb,var(--c) 6%,#fff) 72%); }

/* the sheet: the colour of the department / company that is open (set by s11.js), a grab bar, bigger agents */
.s11-sh{ background:linear-gradient(180deg,color-mix(in srgb,var(--c,#22d3ee) 36%,#0a0f22) 0%,color-mix(in srgb,var(--c,#22d3ee) 20%,#080c1c) 50%,color-mix(in srgb,var(--c,#22d3ee) 12%,#060a18) 100%); }
.s11-sh.drag{ transition:none !important; }
.s11-grab{ display:none; }
.s11-sh-top .s11-rb{ width:36px; margin-left:-7px; } .s11-sh-top .s11-rb:first-child{ margin-left:0; } .s11-sh-top .s11-rb.s11-hd{ width:48px; }
.s11-sh-top .s11-crew em{ font-size:.8rem; padding:2px 8px; }
@media (max-width:819px){ .s11-grab{ display:block; width:44px; height:5px; border-radius:3px; margin:-.3rem auto .75rem; background:rgba(255,255,255,.3); } }
@media (max-width:700px){ .s11-sh-top .s11-rb{ width:48px; margin-left:-8px; } .s11-sh-top .s11-rb.s11-hd{ width:62px; } .s11-sh-top .s11-crew{ bottom:3%; } }

/* the tools: tool cards (an icon, the name, what it does), not a list of chips */
.s11-tools h3 em{ font-style:normal; font-weight:700; font-size:.78rem; padding:2px 8px; border-radius:999px; background:rgba(255,255,255,.08); color:rgba(220,230,242,.7); }
.s11-tls{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:minmax(0,1fr); gap:.55rem; }
@media (min-width:560px){ .s11-tls{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.s11-tool{ position:relative; display:grid; grid-template-columns:46px minmax(0,1fr); gap:.85rem; align-items:start; padding:.9rem .95rem; border-radius:18px;
  background:linear-gradient(150deg,color-mix(in srgb,var(--c) 18%,rgba(255,255,255,.04)),rgba(255,255,255,.025));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), inset 0 0 0 1px color-mix(in srgb,var(--c) 30%,rgba(255,255,255,.06)); }
.s11-tool-ic{ width:46px; height:46px; border-radius:14px; display:grid; place-items:center;
  background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 50%,#0b1226)); box-shadow:0 8px 20px -8px var(--c), inset 0 1px 0 rgba(255,255,255,.35); }
.s11-tool-ic svg{ width:22px; height:22px; fill:none; stroke:#fff; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.s11-tool-tx{ display:flex; flex-direction:column; gap:.25rem; min-width:0; padding-right:1.7rem; }
.s11-tool-tx b{ font:700 1rem/1.25 'Space Grotesk',sans-serif; color:#fff; }
.s11-tool-tx span{ font-size:.87rem; line-height:1.45; color:rgba(220,230,242,.78); overflow-wrap:anywhere; }
.s11-tool-n{ position:absolute; top:.8rem; right:.85rem; font:700 .7rem/1 'Inter',sans-serif; letter-spacing:.08em; color:color-mix(in srgb,var(--c) 55%,#fff); opacity:.75; }

/* /companies: a smaller heading, the library bar (search, filters, found), tiles like the departments, pages */
.s11-hero-sm{ max-width:760px; }
.s11-hero-sm .s11-h1{ font-size:clamp(1.75rem,3.4vw,2.6rem); line-height:1.08; }
.s11-hero-sm .s11-lead{ font-size:clamp(.95rem,1.2vw,1.05rem); margin-top:.8rem; }
.s11-cobar{ display:flex; flex-direction:column; gap:.8rem; margin-top:clamp(1.6rem,3vw,2.2rem); }
.s11-find{ position:relative; display:block; }
.s11-find svg{ position:absolute; left:16px; top:50%; width:20px; height:20px; transform:translateY(-50%); fill:none; stroke:var(--td); stroke-width:2.2; stroke-linecap:round; pointer-events:none; }
.s11-q{ width:100%; height:52px; padding:0 1rem 0 2.9rem; border:0; border-radius:16px; font:500 1rem/1 'Inter',sans-serif; color:var(--ink); outline:none; -webkit-appearance:none; appearance:none;
  background:rgba(255,255,255,.06); box-shadow:inset 0 0 0 1px var(--edge2); transition:box-shadow .25s; }
.s11-q::placeholder{ color:var(--td); }
.s11-q:focus{ box-shadow:inset 0 0 0 1px rgba(127,231,255,.55), 0 0 0 4px rgba(0,212,255,.12); }
.s11-chips{ display:flex; flex-wrap:wrap; gap:.45rem; }
.s11-chip{ display:inline-flex; align-items:center; gap:.45rem; height:38px; padding:0 .95rem; border:0; border-radius:999px; cursor:pointer; font:600 .88rem/1 'Inter',sans-serif; color:var(--tx);
  background:rgba(255,255,255,.06); box-shadow:inset 0 0 0 1px var(--edge2); -webkit-tap-highlight-color:transparent; transition:background .25s, color .25s, box-shadow .25s; }
.s11-chip em{ font-style:normal; font-size:.74rem; font-weight:700; opacity:.65; }
.s11-chip.on{ color:#fff; background:linear-gradient(120deg,#00c6f7,#3b82f6 55%,#7c5cf6); box-shadow:0 8px 22px -10px rgba(0,180,255,.7); }
.s11-chip.on em{ opacity:.85; }
.s11-chip:focus{ outline:none; } .s11-chip:focus-visible{ box-shadow:0 0 0 3px rgba(0,212,255,.35); }
.s11-found{ margin:0; font-size:.85rem; font-weight:600; color:var(--td); }
.s11-cos .s11-cogrid{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(.7rem,1.6vw,1.2rem); margin-top:1.1rem; }
@media (min-width:900px){ .s11-cos .s11-cogrid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.s11-tile[hidden], .s11-none[hidden], .s11-pager[hidden]{ display:none !important; }
.s11-tt .s11-co-tx{ display:flex; flex-direction:column; align-items:flex-start; gap:.3rem; padding:0; -webkit-line-clamp:unset; overflow:visible; font-size:inherit; }
.s11-tt .s11-tag{ display:inline-flex; height:20px; font-size:.6rem; padding:0 .5rem; }
.s11-cot .s11-pic{ aspect-ratio:240/170; }
.s11-none{ margin-top:1.1rem; padding:1.6rem 1.3rem; border-radius:22px; text-align:center; background:var(--panel); box-shadow:inset 0 0 0 1px var(--edge); }
.s11-none p{ margin:0 0 1rem; color:var(--tm); line-height:1.55; }
.s11-pager{ display:flex; justify-content:center; flex-wrap:wrap; gap:.45rem; margin-top:1.6rem; }
.s11-pager button{ min-width:44px; height:44px; padding:0 .8rem; border:0; border-radius:14px; cursor:pointer; font:700 .95rem/1 'Inter',sans-serif; color:var(--tx);
  background:rgba(255,255,255,.06); box-shadow:inset 0 0 0 1px var(--edge2); -webkit-tap-highlight-color:transparent; transition:background .25s; }
.s11-pager button.on{ color:#fff; background:linear-gradient(120deg,#00c6f7,#3b82f6 55%,#7c5cf6); box-shadow:0 8px 22px -10px rgba(0,180,255,.7); }
.s11-pager button:disabled{ opacity:.35; cursor:default; }
.s11-pager button:focus{ outline:none; } .s11-pager button:focus-visible{ box-shadow:0 0 0 3px rgba(0,212,255,.35); }
.s11-pager svg{ width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; vertical-align:middle; }
@media (max-width:700px){ .s11-chip{ height:36px; padding:0 .8rem; font-size:.84rem; } }
html.s11-light .s11-q, body.light .s11-q, html.s11-light .s11-chip:not(.on), body.light .s11-chip:not(.on), html.s11-light .s11-pager button:not(.on), body.light .s11-pager button:not(.on){ background:#fff; }

/* the closing block with its one button */
.s11-cta-b .s11-btn:only-child{ min-width:min(100%,280px); }

/* performance (his phone heated): nothing moves where it cannot be seen, the page stands still under an open sheet */
.s11-off, .s11-off *{ animation-play-state:paused !important; }
html.s11-open .s11 *, html.s11-open .s11-bg i{ animation-play-state:paused !important; }
.s11-cot .s11-co-tx b{ font:700 1.08rem/1.2 'Space Grotesk',sans-serif; letter-spacing:-.01em; overflow-wrap:anywhere; }
@media (max-width:700px){ .s11-cot .s11-co-tx b{ font-size:.95rem; } }