/* 01-cover.css */
.cover{min-height:100vh;justify-content:flex-end;padding-bottom:clamp(40px,10vh,120px)}
.cover-main{max-width:1400px}
.cover .h-mega{font-size:clamp(90px,21vw,380px)}
@media (max-width:640px){ .cover .cover-tag{display:none} }
.cover-line{display:flex;flex-wrap:wrap;gap:clamp(12px,2vw,30px);align-items:center;margin-top:clamp(10px,1.5vw,24px)}
.cover-sub{font-size:clamp(24px,3.6vw,64px);letter-spacing:-.035em}
.cover .chip{font-size:clamp(18px,2.2vw,38px);padding:.25em .7em;border-radius:999px}
.cover-tag{position:absolute;top:clamp(90px,12vh,130px);right:clamp(20px,4vw,60px);background:rgba(220,235,240,.85);border-radius:var(--r);padding:22px 28px;display:flex;flex-direction:column;font-family:var(--font-head);font-weight:500;font-size:clamp(15px,1.4vw,24px);line-height:1.25}
@media (max-width:640px){ .cover-tag{top:90px;padding:14px 18px} }

/* ---- объёмные буквы MMD: выдавленный бок, перламутровая заливка, бегущий блик, лёгкий наклон ---- */
.cover-mmd{perspective:1100px}
.mmd-3d{position:relative;display:inline-block;color:#f4f9fb;transform-style:preserve-3d;
  text-shadow:
    -1px -1px 0 #ffffff, -2px -2px 6px rgba(255,255,255,.6),
    1px 1px 0 #e3eef2, 2px 2px 0 #d7e7ec, 3px 3px 0 #cbdfe6, 4px 4px 0 #bfd7e0,
    5px 5px 0 #b3cfd9, 6px 6px 0 #a7c7d3, 7px 7px 0 #9cbfcc, 8px 8px 0 #92b8c6,
    10px 14px 18px rgba(25,70,90,.22), 18px 34px 60px rgba(25,70,90,.22);
  animation:mmdTilt 14s ease-in-out infinite}
.mmd-3d::after{content:attr(data-text);position:absolute;inset:0;pointer-events:none;text-shadow:none;
  background:
    linear-gradient(100deg, rgba(255,255,255,0) 30%, rgba(255,255,255,.95) 45%, rgba(255,255,255,0) 58%),
    linear-gradient(180deg, #ffffff 0%, #f3f8fa 45%, #dbe9ef 100%);
  background-size:260% 100%, 100% 100%;
  background-repeat:no-repeat;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:mmdSheen 7s ease-in-out infinite}
@keyframes mmdSheen{0%,15%{background-position:120% 0,0 0}60%,100%{background-position:-40% 0,0 0}}
@keyframes mmdTilt{
  0%,100%{transform:rotateX(1.2deg) rotateY(-1.6deg)}
  50%{transform:rotateX(-.6deg) rotateY(1.2deg) translateZ(3px)}
}
@media (prefers-reduced-motion:reduce){ .mmd-3d,.mmd-3d::after{animation:none} }

/* ---- Pharm Marketing Agency + Credentials 2026: тот же объём, что у MMD ---- */
.cover-line{perspective:1100px}
.cover-line-3d{display:flex;flex-wrap:wrap;gap:clamp(12px,2vw,30px);align-items:center;transform-style:preserve-3d;animation:mmdTilt 14s ease-in-out -3s infinite}
.sub-3d{position:relative;display:inline-block;color:#101418;
  text-shadow:
    -1px -1px 0 rgba(255,255,255,.55),
    1px 1px 0 #2b3640, 2px 2px 0 #34414c, 3px 3px 0 #3d4b57, 4px 4px 0 #465663,
    6px 9px 12px rgba(25,60,75,.25), 10px 20px 34px rgba(25,60,75,.2)}
.sub-3d::after{content:attr(data-text);position:absolute;inset:0;pointer-events:none;text-shadow:none;
  background:
    linear-gradient(100deg, rgba(255,255,255,0) 30%, rgba(190,225,235,.75) 45%, rgba(255,255,255,0) 58%),
    linear-gradient(180deg, #2a333b 0%, #0d1013 55%, #000 100%);
  background-size:260% 100%,100% 100%;background-repeat:no-repeat;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:mmdSheen 7s ease-in-out -.6s infinite}
.chip-3d{position:relative;overflow:hidden;
  background:linear-gradient(180deg,#30363c 0%,#16191c 45%,#0b0b0c 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28), inset 0 -2px 4px rgba(0,0,0,.5),
    0 1px 0 #20262b, 0 2px 0 #1c2126, 0 3px 0 #181c20, 0 4px 0 #14181b, 0 5px 0 #101316,
    0 12px 20px rgba(20,50,60,.28), 0 24px 44px rgba(20,50,60,.2);
  text-shadow:0 1px 0 rgba(0,0,0,.6), 0 -1px 0 rgba(255,255,255,.15)}
.chip-3d::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(100deg, rgba(255,255,255,0) 30%, rgba(255,255,255,.28) 45%, rgba(255,255,255,0) 58%);
  background-size:260% 100%;background-repeat:no-repeat;animation:mmdSheen 7s ease-in-out -1.2s infinite}
@media (prefers-reduced-motion:reduce){ .cover-line-3d,.sub-3d::after,.chip-3d::after{animation:none} }

/* обе плашки: чёрные, объёмные, еле заметно плавают в своём ритме */
.cover .chip-agency{font-size:clamp(20px,2.6vw,46px);padding:.22em .7em;border-radius:999px}
.cover-line-3d .chip-3d{animation:pillFloat 7s ease-in-out infinite}
.cover-line-3d .chip-3d + .chip-3d{animation-duration:8.5s;animation-delay:-3s}
@keyframes pillFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.chip-3d::after{background:linear-gradient(100deg, rgba(255,255,255,0) 35%, rgba(170,225,235,.32) 46%, rgba(255,255,255,.18) 50%, rgba(255,255,255,0) 60%);background-size:260% 100%}
@media (prefers-reduced-motion:reduce){ .cover-line-3d .chip-3d{animation:none} }

/* синхронно: весь блок MMD + две плашки движется одним целым */
.cover-main{perspective:1100px}
.cover-main > .cover-sync{transform-style:preserve-3d;animation:mmdTilt 14s ease-in-out infinite}
.cover .mmd-3d, .cover .cover-line-3d, .cover-line-3d .chip-3d{animation:none}
.cover .mmd-3d::after, .cover .chip-3d::after{animation:mmdSheen 7s ease-in-out infinite;animation-delay:0s}
@media (prefers-reduced-motion:reduce){ .cover-main > .cover-sync, .cover .mmd-3d::after, .cover .chip-3d::after{animation:none} }

/* Pharm Marketing Agency: чёрные буквы, перелив синхронно с остальными */
.cover .sub-3d::after{animation:mmdSheen 7s ease-in-out infinite;animation-delay:0s;
  background:
    linear-gradient(100deg, rgba(255,255,255,0) 35%, rgba(170,225,235,.55) 46%, rgba(255,255,255,0) 58%),
    linear-gradient(180deg, #1c2329 0%, #0b0d10 55%, #000 100%);
  background-size:260% 100%,100% 100%;background-repeat:no-repeat;
  -webkit-background-clip:text;background-clip:text;color:transparent}
@media (prefers-reduced-motion:reduce){ .cover .sub-3d::after{animation:none} }

/* 02-icons.css */
/* =====================================================================
   Живые 3D-иконки услуг (CSS 3D). Мотивы — с иконок слайда «Marketing. Medical. Digital.»
   ===================================================================== */
.ic{--s:clamp(88px,8vw,150px);--z:calc(var(--s) * .01);position:relative;flex:none;width:var(--s);height:var(--s);perspective:calc(var(--s) * 5)}
.ic .sc{position:absolute;inset:0;transform-style:preserve-3d}
.ic .sc *{position:absolute;box-sizing:border-box;transform-style:preserve-3d}
.ic .ball{border-radius:50%;
  background:radial-gradient(circle at 32% 28%, #ffd0ca 0%, #f98b81 22%, #f7766c 45%, #d9564d 78%, #b9443c 100%);
  box-shadow:0 calc(var(--z)*4) calc(var(--z)*8) rgba(200,70,60,.25)}
.ic .ball.k{background:radial-gradient(circle at 32% 28%, #8a8f94 0%, #3a3d40 30%, #121314 60%, #000 100%);box-shadow:0 calc(var(--z)*4) calc(var(--z)*8) rgba(0,0,0,.25)}
.ic .ring{border-radius:50%;border:calc(var(--z)*1.6) solid #121314}
.ic .glass{background:linear-gradient(135deg, rgba(255,255,255,.85), rgba(255,255,255,.25));border:1px solid rgba(255,255,255,.95);
  backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);box-shadow:0 calc(var(--z)*4) calc(var(--z)*10) rgba(30,70,90,.14)}
.ic-coral{background:linear-gradient(135deg,#ffa49b 0%,#f7766c 50%,#dc5a51 100%)}

/* ---------- 1. Стратегия 360: атом ---------- */
.ic-atom .sc{transform:rotateX(-14deg)}
.ic-atom .sp{inset:0;animation:icSpinY 14s linear infinite}
.ic-atom .ring{inset:4%}
.ic-atom .r1{transform:rotateX(74deg)}
.ic-atom .r2{transform:rotateZ(60deg) rotateX(74deg)}
.ic-atom .r3{transform:rotateZ(-60deg) rotateX(74deg)}
.ic-atom .orb{inset:0;animation:icSpinZ 3.2s linear infinite}
.ic-atom .o2{animation-duration:4.6s;animation-direction:reverse}
.ic-atom .e{width:14%;height:14%;left:43%;top:-7%;border-radius:50%;background:radial-gradient(circle at 32% 28%,#ffd0ca,#f7766c 50%,#c64c43)}
.ic-atom .e.k{background:radial-gradient(circle at 32% 28%,#888,#111 60%)}
.ic-atom .disc{left:6%;right:6%;top:31%;bottom:31%;border-radius:50%;
  background:radial-gradient(ellipse at 40% 35%, #ffb1a9 0%, #f7766c 45%, #d9564d 100%);transform:rotateZ(-28deg)}
.ic-atom .lens{left:34%;right:34%;top:3%;bottom:3%;border-radius:50%;transform:translateZ(calc(var(--z)*8))}
.ic-atom .core{width:16%;height:16%;left:42%;top:42%;transform:translateZ(calc(var(--z)*14));animation:icPulse 3.2s ease-in-out infinite}

/* ---------- 2. Подготовка контента: круги пересекаются ---------- */
.ic-venn .sc{animation:icSway 9s ease-in-out infinite}
.ic-venn .big{left:2%;top:22%;width:56%;height:56%;background:rgba(255,255,255,.35)}
.ic-venn .v{left:34%;top:22%;width:54%;height:54%;animation:icVenn 6s ease-in-out infinite}
.ic-venn .gv{left:24%;top:30%;width:30%;height:40%;border-radius:50%;opacity:.7;animation:icVennG 6s ease-in-out infinite}
.ic-venn .half{right:0;top:30%;width:20%;height:40%;border:calc(var(--z)*1.6) solid #121314;border-left:none;border-radius:0 999px 999px 0;
  transform-origin:0 50%;animation:icFlip 6s ease-in-out infinite}
@keyframes icVenn{0%,100%{transform:translate3d(-16%,0,calc(var(--z)*-14))}50%{transform:translate3d(6%,-3%,calc(var(--z)*14))}}
@keyframes icVennG{0%,100%{transform:translate3d(0,0,calc(var(--z)*20))}50%{transform:translate3d(-10%,3%,calc(var(--z)*20))}}
@keyframes icFlip{0%,15%{transform:rotateY(0)}45%,65%{transform:rotateY(-160deg)}95%,100%{transform:rotateY(0)}}

/* ---------- 3. Programmatic: кольцо с точками ---------- */
.ic-prog .sc{transform:rotateX(52deg) rotateZ(-10deg)}
.ic-prog .spin{inset:0;animation:icSpinZ 11s linear infinite}
.ic-prog .donut{inset:8%;border-radius:50%;
  -webkit-mask:radial-gradient(circle, transparent 41%, #000 42%, #000 69%, transparent 70%);
          mask:radial-gradient(circle, transparent 41%, #000 42%, #000 69%, transparent 70%)}
.ic-prog .d0{background:#9aa3a8;transform:translateZ(0)}
.ic-prog .d1{background:#c9d0d4;transform:translateZ(calc(var(--z)*3))}
.ic-prog .d2{background:conic-gradient(from 200deg, #0b0b0c 0deg, #3d4246 70deg, #ffffff 160deg, #ffffff 210deg, #9aa1a6 290deg, #0b0b0c 360deg);transform:translateZ(calc(var(--z)*6))}
.ic-prog .rim{inset:8%;transform:translateZ(calc(var(--z)*6.5));border-width:calc(var(--z)*1.2)}
.ic-prog .pt{width:20%;height:20%;transform:translateZ(calc(var(--z)*12))}
.ic-prog .p1{left:20%;top:4%}
.ic-prog .p2{left:76%;top:42%}
.ic-prog .p3{left:20%;top:72%}
.ic-prog .pt .ball{inset:0;animation:icFace 11s linear infinite}
@keyframes icFace{from{transform:rotateZ(0) rotateX(-52deg)}to{transform:rotateZ(-360deg) rotateX(-52deg)}}

/* ---------- 4. Спецпроекты: стопка карточек раскрывается ---------- */
.ic-cards .sc{animation:icCardsTilt 8s ease-in-out infinite}
.ic-cards .cd{border-radius:12%}
.ic-cards .o{left:6%;top:12%;width:54%;height:62%;border:calc(var(--z)*1.6) solid #121314;background:rgba(255,255,255,.45);animation:icZ1 8s ease-in-out infinite}
.ic-cards .c{left:18%;top:20%;width:52%;height:58%;background:linear-gradient(135deg,#ffa49b 0%,#f7766c 50%,#dc5a51 100%);box-shadow:0 calc(var(--z)*6) calc(var(--z)*14) rgba(220,90,80,.25);animation:icZ2 8s ease-in-out infinite}
.ic-cards .k{left:44%;top:44%;width:34%;height:44%;background:linear-gradient(135deg,#46494c,#0b0b0c 60%);box-shadow:0 calc(var(--z)*6) calc(var(--z)*14) rgba(0,0,0,.28);animation:icZ3 8s ease-in-out infinite}
.ic-cards .g{left:60%;top:36%;width:30%;height:50%;animation:icZ4 8s ease-in-out infinite}
@keyframes icCardsTilt{0%,100%{transform:rotateY(-26deg) rotateX(12deg)}50%{transform:rotateY(18deg) rotateX(4deg)}}
@keyframes icZ1{0%,100%{transform:translateZ(calc(var(--z)*-10))}50%{transform:translateZ(calc(var(--z)*-26))}}
@keyframes icZ2{0%,100%{transform:translateZ(0)}50%{transform:translateZ(calc(var(--z)*2))}}
@keyframes icZ3{0%,100%{transform:translateZ(calc(var(--z)*10))}50%{transform:translateZ(calc(var(--z)*28))}}
@keyframes icZ4{0%,100%{transform:translateZ(calc(var(--z)*16))}50%{transform:translateZ(calc(var(--z)*42))}}

/* ---------- 5. Аналитика: объёмная кольцевая диаграмма, сегменты выдвигаются ---------- */
.ic-pie .sc{transform:rotateX(50deg) rotateZ(-18deg)}
.ic-pie .spin{inset:0;animation:icSpinZ 24s linear infinite}
.ic-pie .sg{inset:6%;animation:icPop 6s ease-in-out infinite}
.ic-pie .sg i{position:absolute;inset:0;border-radius:50%;
  -webkit-mask:radial-gradient(circle, transparent 35%, #000 36%);mask:radial-gradient(circle, transparent 35%, #000 36%)}
.ic-pie .sg i:nth-child(1){transform:translateZ(0);filter:brightness(.72)}
.ic-pie .sg i:nth-child(2){transform:translateZ(calc(var(--z)*4));filter:brightness(.85)}
.ic-pie .sg i:nth-child(3){transform:translateZ(calc(var(--z)*8))}
.ic-pie .s1{--dx:calc(var(--z)*7);--dy:calc(var(--z)*-4);--h:calc(var(--z)*6)}
.ic-pie .s1 i{background:conic-gradient(#f7766c 0deg 118deg, transparent 118deg)}
.ic-pie .s1 i:nth-child(3){background:conic-gradient(from 0deg, #ff9d94 0deg, #f7766c 60deg, #e2625a 118deg, transparent 118deg)}
.ic-pie .s2{--dx:calc(var(--z)*1.4);--dy:calc(var(--z)*8);animation-delay:-1.5s}
.ic-pie .s2 i{background:conic-gradient(transparent 0deg 122deg, #eef2f4 122deg 218deg, transparent 218deg)}
.ic-pie .s2 i:nth-child(3){background:conic-gradient(transparent 0deg 122deg, #ffffff 122deg 218deg, transparent 218deg);box-shadow:inset 0 0 0 calc(var(--z)*1.2) #121314}
.ic-pie .s3{--dx:calc(var(--z)*-8);--dy:calc(var(--z)*1.4);animation-delay:-3s}
.ic-pie .s3 i{background:conic-gradient(transparent 0deg 222deg, #0b0b0c 222deg 298deg, transparent 298deg)}
.ic-pie .s3 i:nth-child(3){background:conic-gradient(transparent 0deg 222deg, #3a3d40 222deg, #0b0b0c 298deg, transparent 298deg)}
.ic-pie .s4{--dx:calc(var(--z)*-4);--dy:calc(var(--z)*-7);animation-delay:-4.5s}
.ic-pie .s4 i{background:conic-gradient(transparent 0deg 302deg, rgba(247,118,108,.35) 302deg 356deg, transparent 356deg)}
.ic-pie .s4 i:nth-child(3){background:conic-gradient(transparent 0deg 302deg, rgba(255,210,205,.9) 302deg, rgba(247,118,108,.45) 356deg, transparent 356deg)}
@keyframes icPop{0%,55%,100%{translate:0 0 0}20%,35%{translate:var(--dx) var(--dy) calc(var(--z)*6)}}

/* ---------- 6. Телефонные визиты: человечек, шар, телефон с волнами звонка ---------- */
.ic-call .sc{animation:icSway 9s ease-in-out -2s infinite}
.ic-call .person{left:8%;top:30%;width:32%;height:64%;animation:icBob 4s ease-in-out infinite}
.ic-call .head{left:16%;top:0;width:66%;height:42%}
.ic-call .body{left:8%;top:48%;width:84%;height:52%;border-radius:40% 40% 22% 22%;
  background:linear-gradient(160deg,#ffa49b 0%,#f7766c 50%,#dc5a51 100%);box-shadow:0 calc(var(--z)*4) calc(var(--z)*10) rgba(220,90,80,.25)}
.ic-call .bob{left:50%;top:4%;width:26%;height:26%;transform:translateZ(calc(var(--z)*8));animation:icBob 4s ease-in-out -2s infinite}
.ic-call .ph{left:56%;top:40%;width:30%;height:48%;border-radius:18%;border:calc(var(--z)*1.6) solid #121314;animation:icPhone 6s ease-in-out infinite}
.ic-call .wv{left:56%;top:40%;width:30%;height:48%;border-radius:22%;border:calc(var(--z)*1.4) solid #f7766c;opacity:0;animation:icWave 2.6s ease-out infinite}
.ic-call .w2{animation-delay:1.3s}
@keyframes icPhone{0%,100%{transform:rotateY(-28deg) translateZ(calc(var(--z)*6))}50%{transform:rotateY(22deg) translateZ(calc(var(--z)*14))}}
@keyframes icWave{0%{opacity:.75;transform:scale(1) translateZ(calc(var(--z)*4))}100%{opacity:0;transform:scale(1.6) translateZ(calc(var(--z)*4))}}

/* ---------- общие движения ---------- */
@keyframes icSpinY{to{transform:rotateY(360deg)}}
@keyframes icSpinZ{to{transform:rotateZ(360deg)}}
@keyframes icSway{0%,100%{transform:rotateY(-18deg) rotateX(8deg)}50%{transform:rotateY(16deg) rotateX(-4deg)}}
@keyframes icBob{0%,100%{translate:0 0}50%{translate:0 -6%}}
@keyframes icPulse{0%,100%{scale:1}50%{scale:1.18}}

@media (prefers-reduced-motion:reduce){ .ic *, .ic .sc{animation:none !important} }

/* 02-services.css */
.s02{justify-content:center}
.s02 .h1{max-width:1500px}
.s02-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,26px);max-width:1640px}
.s02-item{display:flex;align-items:center;justify-content:space-between;gap:clamp(12px,1.4vw,24px);background:#fff;border-radius:var(--r-md);padding:clamp(18px,2vw,34px) clamp(18px,2vw,34px);min-height:clamp(150px,13vw,230px);box-shadow:0 10px 40px rgba(40,90,110,.08);transition:box-shadow .4s ease}
.s02-item:hover{box-shadow:0 18px 50px rgba(40,90,110,.16)}
.s02-item .lead{line-height:1.2;max-width:15em}
.s02-ico{position:relative;flex:none;width:clamp(76px,7.5vw,140px);aspect-ratio:1;overflow:hidden}
.s02-ico img{position:absolute;max-width:none;height:auto;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.s02-item:hover .s02-ico img{transform:scale(1.06)}
@media (max-width:1100px){ .s02-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:820px){ .s02-grid{grid-template-columns:1fr} .s02-item{min-height:0} }

/* 03-growth.css */
.growth{justify-content:center}
.growth .veil-teal{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg, rgba(78,168,180,0) 45%, rgba(78,168,180,.3) 62%, rgba(78,168,180,.45) 80%)}
.growth-text{margin-left:44%;max-width:860px}
.growth .h1{margin:.25em 0 .5em}
@media (max-width:820px){
  .growth{justify-content:flex-end}
  .growth-text{margin-left:0}
  .growth .veil-teal{background:linear-gradient(180deg, rgba(86,166,182,0) 35%, rgba(86,166,182,.75) 60%, rgba(86,166,182,.92) 100%)}
}

/* 04-facts.css */
.facts{justify-content:center}
.facts-big{display:flex;flex-wrap:wrap;gap:clamp(24px,5vw,90px);max-width:74%}
.facts .num-xl{font-size:clamp(44px,5.4vw,100px)}
.facts-chips{display:flex;flex-wrap:wrap;gap:clamp(20px,5vw,90px);align-items:flex-start;max-width:78%}
@media (max-width:820px){ .facts-big,.facts-chips{max-width:none} }

/* 05-awards.css */
.s05{justify-content:center}
.s05-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);gap:clamp(24px,4vw,70px);align-items:center}
.s05-title{font-size:clamp(34px,4.6vw,84px);line-height:.98}
.s05-awards{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:auto;gap:clamp(14px,1.8vw,30px) clamp(12px,1.4vw,24px)}
.s05-award{background:#fff;border-radius:var(--r-md);padding:clamp(18px,2.2vw,38px) clamp(20px,2.6vw,44px);box-shadow:0 14px 44px rgba(30,80,90,.12);display:flex;flex-direction:column;gap:.55em}
.s05-award.alt{background:#dcecf2}
.s05-award .label{align-self:flex-start;font-size:clamp(10px,.8vw,13px)}
.s05-award .h3{font-weight:600}
.s05-slot.a1{grid-column:1 / 7;grid-row:1;margin-top:clamp(30px,5vw,90px)}
.s05-slot.a2{grid-column:7 / 13;grid-row:1}
.s05-slot.a3{grid-column:6 / 13;grid-row:2;margin-top:clamp(-40px,-2vw,-10px)}
.s05-slot.a4{grid-column:1 / 7;grid-row:2 / 4;align-self:end}
.s05-slot.a5{grid-column:7 / 13;grid-row:3}
@media (max-width:820px){
  .s05-layout{grid-template-columns:1fr}
  .s05-awards{grid-template-columns:1fr}
  .s05-slot.a1,.s05-slot.a2,.s05-slot.a3,.s05-slot.a4,.s05-slot.a5{grid-column:auto;grid-row:auto;margin-top:0;align-self:stretch}
}

/* ---- плашки наград как парящие 3D-таблички ---- */
.s05-awards{perspective:1300px;perspective-origin:50% 40%}
.s05-slot{align-self:start;transform-style:preserve-3d}
.s05-slot.a4{align-self:end}
.s05-award{position:relative;transform-style:preserve-3d;
  animation:s05float var(--dur,9s) ease-in-out var(--del,0s) infinite;
  box-shadow:0 30px 60px -18px rgba(25,70,85,.35),0 8px 20px rgba(25,70,85,.10);
  background-image:linear-gradient(135deg,rgba(255,255,255,.9) 0%,rgba(255,255,255,0) 45%),linear-gradient(#fff,#fff)}
.s05-award.alt{background-image:linear-gradient(135deg,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 45%),linear-gradient(#dcecf2,#dcecf2)}
/* толщина таблички — ребро позади */
.s05-award::after{content:"";position:absolute;inset:0;border-radius:inherit;background:#b9d3dc;transform:translateZ(-14px);
  box-shadow:0 0 0 1px rgba(255,255,255,.4) inset}
.s05-award.alt::after{background:#9fc2cf}
/* глянцевый блик, медленно скользит */
.s05-award::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,rgba(255,255,255,0) 30%,rgba(255,255,255,.75) 46%,rgba(255,255,255,0) 60%);
  background-size:260% 100%;animation:s05shine var(--dur,9s) ease-in-out var(--del,0s) infinite;mix-blend-mode:soft-light;transform:translateZ(1px)}
.s05-award > *{position:relative;transform:translateZ(2px)}
@keyframes s05float{
  0%,100%{transform:translate3d(0,0,0) rotateX(var(--rx,6deg)) rotateY(var(--ry,-10deg)) rotateZ(var(--rz,-1deg))}
  50%{transform:translate3d(0,-16px,26px) rotateX(calc(var(--rx,6deg) * -1)) rotateY(calc(var(--ry,-10deg) * -.6)) rotateZ(calc(var(--rz,-1deg) * -1))}
}
@keyframes s05shine{0%,100%{background-position:100% 0}50%{background-position:0 0}}
.s05-slot.a1 .s05-award{--dur:9s;--del:-1s;--rx:7deg;--ry:-12deg;--rz:-1.5deg}
.s05-slot.a2 .s05-award{--dur:11s;--del:-4s;--rx:-6deg;--ry:10deg;--rz:1.2deg}
.s05-slot.a3 .s05-award{--dur:10s;--del:-7s;--rx:5deg;--ry:9deg;--rz:-1deg}
.s05-slot.a4 .s05-award{--dur:12s;--del:-2.5s;--rx:-7deg;--ry:-9deg;--rz:1.4deg}
.s05-slot.a5 .s05-award{--dur:10.5s;--del:-5.5s;--rx:6deg;--ry:-8deg;--rz:.8deg}
@media (prefers-reduced-motion:reduce){ .s05-award,.s05-award::before{animation:none} }

/* ---- объёмный парящий заголовок ---- */
.s05-title{perspective:900px}
.s05-t3d{display:inline-block;transform-style:preserve-3d;animation:s05title 12s ease-in-out infinite}
.s05-t3d > span{display:inline-block;
  text-shadow:
    0 1px 0 #e6f1f3, 0 2px 0 #d6e8ec, 0 3px 0 #c7dfe5, 0 4px 0 #b8d5dd,
    0 5px 0 #a9ccd6, 0 6px 0 #9ac2cf, 0 7px 0 #8bb8c7,
    0 10px 12px rgba(20,60,75,.28), 0 22px 40px rgba(20,60,75,.22);
  animation:s05word 9s ease-in-out infinite}
.s05-t3d > span:nth-child(2){animation-delay:-3s}
.s05-t3d > span:nth-child(3){animation-delay:-6s}
@keyframes s05title{
  0%,100%{transform:rotateX(5deg) rotateY(7deg)}
  50%{transform:rotateX(-3deg) rotateY(-4deg)}
}
@keyframes s05word{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(3px,-4px,14px)}
}
/* ---- фон этого блока переливается заметнее ---- */
.s05.bg{animation:s05bg 11s ease-in-out infinite alternate}
@keyframes s05bg{
  0%{--ax:0%;--ay:0%;--bx:4%;--by:100%;--s1:42%;--s2:80%}
  50%{--ax:28%;--ay:34%;--bx:30%;--by:72%;--s1:24%;--s2:58%}
  100%{--ax:10%;--ay:60%;--bx:0%;--by:88%;--s1:36%;--s2:70%}
}
/* поверхность плашек: мягкий перелив цвета */
.s05-award{background-size:200% 200%,100% 100%}
.s05-award.alt{background-image:linear-gradient(135deg,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 45%),linear-gradient(120deg,#dcecf2,#eef6f2,#f6e6e6,#dcecf2);background-size:200% 200%,300% 300%;animation:s05float var(--dur,9s) ease-in-out var(--del,0s) infinite,s05surf 14s ease-in-out infinite alternate}
@keyframes s05surf{to{background-position:100% 100%,100% 0}}
@media (prefers-reduced-motion:reduce){ .s05-t3d,.s05-t3d > span,.s05.bg{animation:none} }

/* ===== пазловые плашки как на слайде: без качания, только лёгкое «дыхание» ===== */
.s05-award{animation:s05breathe 7s ease-in-out infinite !important;transform:none;transform-style:flat;
  background:none !important;box-shadow:none !important;padding:clamp(16px,1.8vw,30px) clamp(20px,2.2vw,36px)}
.s05-award.alt{--pz-bg:#dcecf2}
.s05-award::after,.s05-award::before{content:none !important;animation:none !important}
.s05-award > :not(.pz-shape){transform:none}
.s05-award .h3{font-family:var(--font-head);font-weight:400;font-size:clamp(17px,1.55vw,29px);line-height:1.15;letter-spacing:-.015em}
.s05-slot.a2 .s05-award{animation-delay:-1.4s !important}
.s05-slot.a3 .s05-award{animation-delay:-2.8s !important}
.s05-slot.a4 .s05-award{animation-delay:-4.2s !important}
.s05-slot.a5 .s05-award{animation-delay:-5.6s !important}
@keyframes s05breathe{0%,100%{scale:1;translate:0 0}50%{scale:1.015;translate:0 -3px}}
/* место под язычки, чтобы не наезжали на соседей */
.s05-awards{row-gap:clamp(30px,3.4vw,58px)}
@media (prefers-reduced-motion:reduce){ .s05-award{animation:none !important} }
/* язычки крупнее — как на слайде */
.s05-award.pz{--pz-d:clamp(18px,2.1vw,38px);--pz-r:clamp(18px,1.8vw,30px)}
/* расстановка как на оригинальном слайде — плашки не соприкасаются */
@media (min-width:821px){
  .s05-awards{display:block;position:relative;aspect-ratio:1.3;width:100%}
  .s05-slot{position:absolute;margin:0 !important}
  .s05-slot.a1{left:1%;top:14%;width:37%}
  .s05-slot.a2{left:55%;top:2%;width:36%}
  .s05-slot.a3{left:49%;top:36%;width:39%}
  .s05-slot.a4{left:4%;top:72%;width:36%}
  .s05-slot.a5{left:56%;top:68%;width:41%}
}
@media (min-width:821px){
  .s05-layout{grid-template-columns:minmax(0,.62fr) minmax(0,1.6fr);gap:clamp(16px,2.4vw,44px)}
  .s05-awards{aspect-ratio:1.55}
  .s05-award .h3{font-size:clamp(15px,1.32vw,26px)}
  .s05-slot.a3{top:37%}
  .s05-slot.a5{top:71%}
}
@media (min-width:821px){
  .s05-layout{grid-template-columns:minmax(0,.72fr) minmax(0,1.5fr)}
  .s05-title{font-size:clamp(28px,3.3vw,64px)}
}

/* ===== объём пазловых плашек: ребро-толщина + тень (огибают и язычки) ===== */
.s05-award .pz-shape{filter:url(#pzgoo)
  drop-shadow(0 1px 0 #e3eef2) drop-shadow(0 2px 0 #d3e4ea) drop-shadow(0 2px 0 #c4d9e1) drop-shadow(0 2px 0 #b6cfd9)
  drop-shadow(0 16px 24px rgba(20,70,85,.2))}
.s05-award.alt .pz-shape{filter:url(#pzgoo)
  drop-shadow(0 1px 0 #c9dfe7) drop-shadow(0 2px 0 #b8d3de) drop-shadow(0 2px 0 #a7c7d4) drop-shadow(0 2px 0 #97bccb)
  drop-shadow(0 16px 24px rgba(20,70,85,.2))}
/* лёгкий блик сверху по лицевой стороне (статичный) */
.s05-award .pz-base{background:linear-gradient(180deg, color-mix(in srgb, var(--pz-bg) 70%, #fff) 0%, var(--pz-bg) 40%)}

/* ===== язычки слегка морфируют: скользят вдоль края и чуть меняют ширину ===== */
.s05-award .pz-tab.s-t,.s05-award .pz-tab.s-b,.s05-award .pz-knob.s-t,.s05-award .pz-knob.s-b{animation:s05morphX 6.5s ease-in-out infinite}
.s05-award .pz-tab.s-l,.s05-award .pz-tab.s-r,.s05-award .pz-knob.s-l,.s05-award .pz-knob.s-r{animation:s05morphY 7.5s ease-in-out infinite}
.s05-award .pz-tab{transform-origin:50% 50%}
@keyframes s05morphX{0%,100%{translate:0 0;scale:1 1}50%{translate:clamp(8px,1vw,18px) 0;scale:1.12 1}}
@keyframes s05morphY{0%,100%{translate:0 0;scale:1 1}50%{translate:0 clamp(6px,.8vw,14px);scale:1 1.12}}
.s05-award .pz-knob{scale:1 !important}
.s05-slot.a2 .pz-shape i{animation-delay:-1.6s}
.s05-slot.a3 .pz-shape i{animation-delay:-3.2s}
.s05-slot.a4 .pz-shape i{animation-delay:-4.4s}
.s05-slot.a5 .pz-shape i{animation-delay:-2.4s}

/* ===== заголовок: объёмный, но неподвижный ===== */
.s05-t3d,.s05-t3d > span{animation:none !important;transform:none !important}

@media (prefers-reduced-motion:reduce){ .s05-award .pz-shape i{animation:none !important} }
/* крупнее заголовок (как на слайде) */
@media (min-width:821px){
  .s05-layout{grid-template-columns:minmax(0,1fr) minmax(0,1.45fr)}
  .s05-title{font-size:clamp(34px,4.3vw,84px)}
  .s05-awards{aspect-ratio:1.42}
}
@media (max-width:820px){ .s05-title{font-size:clamp(34px,9vw,56px)} }

/* 06-base.css */
.s06{justify-content:center;min-height:calc(100vh - 2 * var(--gap))}
.s06-stats{display:flex;flex-direction:column;gap:clamp(28px,4vw,60px);margin-top:clamp(28px,4vw,64px);max-width:1500px}
.s06-stat{position:relative;border:1.5px solid var(--line);border-radius:var(--r-md);padding:0 clamp(20px,3vw,60px) clamp(18px,2vw,34px) clamp(20px,3vw,60px);width:min(100%,780px)}
.s06-stat.st2{align-self:flex-end;margin-right:clamp(0px,8vw,180px)}
.s06-num{display:inline-block;background:#fff;padding-right:.15em;margin:-.5em 0 0 calc(-1 * clamp(20px,3vw,60px) - 4px);white-space:nowrap;font-size:clamp(46px,7.4vw,138px);font-variant-numeric:tabular-nums}
.s06-stat .lead{margin-top:clamp(8px,1vw,16px);padding-left:clamp(0px,5vw,90px)}
@media (max-width:820px){
  .s06-stat,.s06-stat.st2{width:100%;margin-right:0;align-self:stretch}
  .s06-stat .lead{padding-left:0}
  .s06-num{font-size:clamp(40px,12vw,80px)}
}

/* 07-sources.css */
/* «Источники базы MMD»: пять одинаковых белых плашек медленно ходят по эллипсу вокруг центра.
   Эллипс рассчитан под размеры плашек и центра — зазор до центра одинаковый, наездов нет.
   Язычок-пазл всегда смотрит на центр и перетекает по краю (SVG goo). Наведение — пауза. */
.s07{justify-content:center}
.s07-map{--T:240s;--Rx:35cqw;--Ry:18.5cqw;
  position:relative;width:100%;max-width:1500px;margin:0 auto;aspect-ratio:2.05;container-type:inline-size;perspective:2200px}
.s07-map.rv{transform:none}
.s07-defs{position:absolute;width:0;height:0;overflow:hidden}
.s07-stage{position:absolute;inset:0;transform-style:preserve-3d;animation:s07sway 26s ease-in-out infinite}
@keyframes s07sway{0%,100%{transform:rotateX(7deg) rotateY(-4deg)}50%{transform:rotateX(4deg) rotateY(4deg)}}

/* центр */
.s07-hub{position:absolute;left:50%;top:50%;width:18cqw;height:12cqw;margin:-6cqw 0 0 -9cqw;border-radius:clamp(14px,2cqw,30px);display:grid;place-items:center;text-align:center;
  background:linear-gradient(160deg,#63b2bf 0%,#4fa3b3 55%,#4598a8 100%);transform:translateZ(6px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 1px 0 #3f93a3,0 2px 0 #3a8a99,0 3px 0 #358190,0 18px 40px rgba(20,80,95,.28)}
.s07-hub-t{font-family:var(--font-head);font-weight:800;font-size:clamp(16px,2.1cqw,38px);line-height:1;letter-spacing:-.04em;color:#fff;text-shadow:0 2px 6px rgba(20,70,85,.18)}

/* движение по эллипсу: x = Rx·cos θ, y = Ry·sin θ (синусоидальная анимация двух осей) */
.s07-slot{position:absolute;left:50%;top:50%}
.s07-x{animation:s07x calc(var(--T) / 2) cubic-bezier(.37,0,.63,1) calc(var(--p) * var(--T) * -1) infinite alternate}
.s07-y{animation:s07y calc(var(--T) / 2) cubic-bezier(.37,0,.63,1) calc((var(--p) + .25) * var(--T) * -1) infinite alternate}
@keyframes s07x{from{transform:translateX(var(--Rx))}to{transform:translateX(calc(var(--Rx) * -1))}}
@keyframes s07y{from{transform:translateY(calc(var(--Ry) * -1))}to{transform:translateY(var(--Ry))}}

/* плашка: внизу и вверху — широкая и низкая, по бокам — узкая и высокая (как на слайде); переход плавный.
   ширина = 18 + 14·sin²θ — та же синусоида, что и у орбиты, поэтому синхронно */
.s07-node{position:absolute;left:0;top:0;transform:translate(-50%,-50%);width:18cqw;height:13cqw;
  padding:0 2cqw;display:flex;align-items:center;justify-content:center;text-align:center;
  animation:s07wh calc(var(--T) / 4) cubic-bezier(.37,0,.63,1) calc(var(--p) * var(--T) * -1) infinite alternate}
@keyframes s07wh{from{width:18cqw;height:13cqw}to{width:32cqw;height:9cqw}}
.s07-node p{position:relative;z-index:1;font-family:var(--font-head);font-weight:400;font-size:clamp(13px,1.52cqw,26px);line-height:1.22;letter-spacing:-.01em;color:#0b0b0c}

/* цельная форма «плашка + язычок-пазл» (SVG goo даёт плавные вогнутые переходы, как на слайде) */
.s07-shape{position:absolute;inset:0;pointer-events:none;
  filter:url(#s07goo) drop-shadow(0 2px 0 #d3e3e9) drop-shadow(0 12px 18px rgba(20,70,85,.2))}
.s07-shape i{position:absolute;background:#fff}
.s07-shape .b0{inset:0;border-radius:clamp(14px,2cqw,30px)}
.s07-shape .b1{border-radius:clamp(8px,1.1cqw,18px);
  animation:s07tabdir var(--T) linear calc(var(--p) * var(--T) * -1) infinite}
/* язычок смотрит на центр. θ: 0° — плашка справа → язычок слева; 90° — снизу → сверху; 180° — слева → справа; 270° — сверху → снизу */
@keyframes s07tabdir{
  0%,100%{left:calc(0% - 2.2cqw);top:calc(50% - 2.6cqw);width:4.4cqw;height:5.2cqw}
  12.5%{left:calc(0% - 1.4cqw);top:calc(0% - 1.6cqw);width:4.6cqw;height:4.4cqw}
  25%{left:calc(50% - 2.6cqw);top:calc(0% - 2.2cqw);width:5.2cqw;height:4.4cqw}
  37.5%{left:calc(100% - 3.2cqw);top:calc(0% - 1.6cqw);width:4.6cqw;height:4.4cqw}
  50%{left:calc(100% - 2.2cqw);top:calc(50% - 2.6cqw);width:4.4cqw;height:5.2cqw}
  62.5%{left:calc(100% - 3.2cqw);top:calc(100% - 2.8cqw);width:4.6cqw;height:4.4cqw}
  75%{left:calc(50% - 2.6cqw);top:calc(100% - 2.2cqw);width:5.2cqw;height:4.4cqw}
  87.5%{left:calc(0% - 1.4cqw);top:calc(100% - 2.8cqw);width:4.6cqw;height:4.4cqw}}

/* наведение — пауза */
.s07-map:hover .s07-x,.s07-map:hover .s07-y,.s07-map:hover .s07-node,.s07-map:hover .s07-shape i{animation-play-state:paused}

/* стеклянные блики */
.s07-glass{position:absolute;border-radius:clamp(12px,1.6cqw,24px);background:linear-gradient(135deg,rgba(255,255,255,.5),rgba(255,255,255,.1));
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:none;animation:float 9s ease-in-out infinite}
.g1{left:2%;top:4%;width:6%;height:15%}
.g2{left:92%;top:78%;width:5%;height:15%;animation-delay:-4s}

/* мобильный: без орбиты, столбиком */
@media (max-width:820px){
  .s07-map{aspect-ratio:auto;perspective:none}
  .s07-stage{position:relative;inset:auto;display:flex;flex-direction:column;gap:18px;animation:none;transform:none}
  .s07-slot,.s07-x,.s07-y{display:contents}
  .s07-hub,.s07-node{position:relative;left:auto;top:auto;width:auto;height:auto;margin:0;transform:none;animation:none}
  .s07-hub{padding:28px 20px}
  .s07-hub-t{font-size:26px}
  .s07-node{padding:22px;background:#fff;border-radius:22px;box-shadow:0 12px 30px rgba(20,70,85,.15)}
  .s07-shape{display:none}
  .s07-node p{font-size:17px}
  .s07-glass{display:none}
}
@media (prefers-reduced-motion:reduce){ .s07-stage,.s07-x,.s07-y,.s07-node,.s07-shape i,.s07-glass{animation:none} }

/* 08-medtarget.css */
.s08{justify-content:center}
.s08-head{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(20px,3vw,56px);align-items:center}
.s08-head .h1{font-size:clamp(34px,4.6vw,86px)}
.s08-banner{position:relative;overflow:hidden;border-radius:var(--r);padding:clamp(22px,2.6vw,46px) clamp(24px,2.8vw,50px);color:#fff;
  background:linear-gradient(100deg,#55a6b5 0%,#5aa48f 55%,#5ea35e 100%);background-size:160% 100%;animation:s08-sheen 9s ease-in-out infinite alternate}
@keyframes s08-sheen{to{background-position:100% 0}}
.s08-banner > :not(.pix){position:relative;z-index:2}
.s08-brand{font-family:var(--font-head);font-weight:800;font-size:clamp(40px,5.6vw,104px);line-height:1;letter-spacing:-.05em}
.s08-slogan{font-family:var(--font-head);font-weight:500;font-size:clamp(14px,1.45vw,26px);letter-spacing:-.02em;margin-top:.6em}

/* процесс: 4 шага лесенкой */
.s08-flow{position:relative;width:min(100%,1460px);margin-left:auto;margin-right:auto;aspect-ratio:1455/365}
.s08-arrows{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.s08-a{opacity:0}
.s08-a circle{fill:var(--ink)}
.s08-a path{fill:none;stroke:var(--ink);stroke-width:1.6;stroke-dasharray:260;stroke-dashoffset:260}
.s08-flow:has(.rv.in) .s08-a{animation:s08-fade .3s ease forwards;animation-delay:var(--d)}
.s08-flow:has(.rv.in) .s08-a path{animation:s08-draw 1s cubic-bezier(.4,0,.2,1) forwards;animation-delay:var(--d)}
@keyframes s08-fade{to{opacity:1}}
@keyframes s08-draw{to{stroke-dashoffset:0}}
.s08-step{position:absolute;left:var(--x);top:var(--y);width:31%;height:46%;border:1.5px solid var(--ink);border-radius:var(--r-md);background:#fff;
  display:flex;align-items:center;padding:0 clamp(14px,1.6vw,28px) 0 clamp(52px,4.6vw,80px)}
.s08-step .chip{position:absolute;left:0;top:50%;translate:-50% -50%;color:#fff;font-size:clamp(16px,1.6vw,28px)}
.s08-step .lead{font-size:clamp(14px,1.45vw,25px);line-height:1.2}
.s08-note{font-weight:600;font-size:clamp(16px,1.55vw,28px);line-height:1.25}

@media (max-width:1100px){
  .s08-head{grid-template-columns:1fr}
  .s08-flow{aspect-ratio:auto;display:grid;gap:clamp(18px,3vw,28px);padding-left:22px}
  .s08-arrows{display:none}
  .s08-step{position:relative;left:auto;top:auto;width:auto;height:auto;min-height:96px;padding:18px 20px 18px 46px}
  .s08-step:not(:last-child)::after{content:"";position:absolute;left:40%;bottom:-18px;width:1.5px;height:18px;background:var(--ink)}
}
@media (prefers-reduced-motion:reduce){ .s08-banner{animation:none} .s08-a{opacity:1} .s08-a path{stroke-dashoffset:0} }

/* 09-principles.css */
.s09{justify-content:center}
.s09-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2.4vw,48px);align-items:stretch}
.s09-col{display:flex;flex-direction:column;gap:clamp(8px,.8vw,14px)}
.s09-head{font-family:var(--font-head);font-weight:500;font-size:clamp(18px,1.9vw,34px);letter-spacing:-.025em;line-height:1.1;color:#fff;text-align:center;
  padding:.4em .6em;border-radius:var(--r-sm);background:var(--hc)}
.s09-body{position:relative;overflow:hidden;flex:1;border-radius:var(--r-md);padding:clamp(20px,2.4vw,46px) clamp(18px,2.2vw,40px);
  background:linear-gradient(var(--ga,135deg),var(--g1) 0%,var(--g1) 30%,var(--g2) 100%);background-size:100% 140%;background-position:0 0;
  transition:background-position 1.2s ease}
.s09-col:hover .s09-body{background-position:0 100%}
.s09-body .list,.s09-body.list{gap:1.4em;position:relative;z-index:1}
.s09-body .list li::before,.s09-body.list li::before{left:-.2em}
.s09-teal{--hc:#57a8b7;--g1:#d7e9ef;--g2:#7db8c7}
.s09-coral{--hc:var(--coral);--g1:#ece4ea;--g2:#f98a80;--ga:100deg}
.s09-green{--hc:#5ea35e;--g1:#d7e9ef;--g2:#82bd85}
.s09-body a{color:#4fa3b3;font-weight:700;text-underline-offset:3px}
@media (max-width:980px){ .s09-cols{grid-template-columns:1fr} }

/* 10-ecosystem.css */
.s10{justify-content:center}
.s10 > .s10-veil{position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(55% 60% at 88% 100%,rgba(79,158,110,.75) 0%,rgba(79,158,110,0) 70%)}
.s10-title{max-width:16ch}
.s10-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,4vw,90px)}
.s10-card{display:grid;grid-template-columns:minmax(0,1fr) clamp(110px,11vw,200px);gap:clamp(16px,2vw,36px);align-items:center;
  background:#fff;border-radius:var(--r);padding:clamp(22px,2.6vw,46px);box-shadow:0 20px 50px rgba(30,70,90,.12)}
.s10-rev{grid-template-columns:clamp(110px,11vw,200px) minmax(0,1fr)}
.s10-h{font-size:clamp(24px,2.4vw,44px);padding-bottom:.45em;margin-bottom:.7em;border-bottom:1.5px solid #b9d3dc}
.s10 .list{gap:.7em}
.s10-ava{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:var(--r-md);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.s10-card:hover .s10-ava{transform:scale(1.04) rotate(-1.5deg)}
@media (max-width:1100px){ .s10-pair{grid-template-columns:1fr} }
@media (max-width:640px){
  .s10-card,.s10-rev{grid-template-columns:1fr}
  .s10-ava{width:120px}
  .s10-rev .s10-ava{order:-1}
}

/* 11-departments.css */
.s11{justify-content:center}
.s11-map{display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,30vw,540px) minmax(0,1fr);grid-template-areas:"mgr ring med" "dig ring .";
  column-gap:clamp(24px,4vw,80px);row-gap:clamp(20px,3vw,50px);align-items:center;max-width:1500px;width:100%;margin-left:auto;margin-right:auto}
/* ---------- объёмное кольцо (CSS 3D): 3 ломтика из стопки слоёв ---------- */
@property --s11-sw{syntax:'<angle>';inherits:true;initial-value:0deg}
@property --s11-h{syntax:'<number>';inherits:true;initial-value:0}
.s11-chart3d{grid-area:ring;position:relative;width:100%;aspect-ratio:1.35;container-type:inline-size}
.s11-stage{position:absolute;inset:0;z-index:0;perspective:170cqw;perspective-origin:50% 46%;pointer-events:none}
.s11-stage *{position:absolute;box-sizing:border-box;transform-style:preserve-3d}
.s11-tilt{left:14cqw;top:calc(46% - 36cqw);width:72cqw;height:72cqw;transform:rotateX(52deg)}
.s11-spin{inset:0;animation:s11sway 16s ease-in-out infinite alternate}
.s11-shadow{inset:-6%;border-radius:50%;transform:translateZ(-1cqw);
  background:radial-gradient(closest-side, rgba(25,70,90,.2) 55%, rgba(25,70,90,.08) 78%, rgba(25,70,90,0) 100%)}
/* сегмент: --a0 начало, --sw полный угол, --c цвет, --hi блик; выдвигается по биссектрисе (--dx,--dy) */
.s11-seg{inset:0;--s11-sw:0deg;--s11-h:0;
  transition:--s11-sw 1.1s cubic-bezier(.5,0,.2,1) calc(.2s + var(--i) * .45s),--s11-h .9s cubic-bezier(.3,1.5,.5,1) calc(.35s + var(--i) * .45s)}
.s11-seg i{inset:0;border-radius:50%;
  --lc:color-mix(in srgb, var(--c) calc(58% + var(--k) * 5%), #1f3b45);
  background:conic-gradient(from var(--a0), var(--lc) 0deg var(--s11-sw), transparent 0deg);
  -webkit-mask:radial-gradient(closest-side, transparent 64%, #000 64.6%, #000 99.2%, transparent 100%);
          mask:radial-gradient(closest-side, transparent 64%, #000 64.6%, #000 99.2%, transparent 100%);
  transform:translateZ(calc(var(--k) * .62cqw * var(--s11-h)))}
.s11-seg i:nth-child(1){--k:0}.s11-seg i:nth-child(2){--k:1}.s11-seg i:nth-child(3){--k:2}.s11-seg i:nth-child(4){--k:3}
.s11-seg i:nth-child(5){--k:4}.s11-seg i:nth-child(6){--k:5}.s11-seg i:nth-child(7){--k:6}
.s11-seg i:nth-child(8){--k:7;background:conic-gradient(from var(--a0), var(--hi) 0deg, var(--c) calc(var(--s11-sw) * .55), var(--c2) var(--s11-sw), transparent 0deg)}
.s11-mg{--a0:266deg;--sw:126deg;--c:#b5cedb;--hi:#dcebf1;--c2:#a6c3d1;--dx:-1.6cqw;--dy:-2.8cqw}
.s11-md{--a0:33deg;--sw:123deg;--c:#f7766c;--hi:#ffa49b;--c2:#e2625a;--dx:3.2cqw;--dy:.3cqw}
.s11-dg{--a0:157deg;--sw:108deg;--c:#56a7b6;--hi:#8fcfd8;--c2:#4a97a6;--dx:-1.7cqw;--dy:2.8cqw}
/* стеклянная линза в центре кольца */
.s11-lens{inset:22%;border-radius:50%;transform:translateZ(7cqw);opacity:0;
  background:radial-gradient(circle at 34% 30%, rgba(255,255,255,.95), rgba(236,245,248,.55) 45%, rgba(200,226,233,.3) 100%);
  border:1px solid rgba(255,255,255,.95);box-shadow:0 2cqw 6cqw rgba(30,70,90,.12), inset 0 0 0 .4cqw rgba(86,167,182,.12);
  transition:opacity 1s ease 1.8s}
.s11-chart3d.in .s11-seg{--s11-sw:var(--sw);--s11-h:1;animation:s11pop 9s ease-in-out calc(2.6s + var(--i) * 3s) infinite}
.s11-chart3d.in .s11-lens{opacity:1;animation:s11lens 6s ease-in-out 2.6s infinite}
@keyframes s11sway{from{transform:rotateZ(-15deg)}to{transform:rotateZ(15deg)}}
@keyframes s11pop{0%,40%,100%{translate:0 0 0}14%,26%{translate:var(--dx) var(--dy) 2.6cqw}}
@keyframes s11lens{0%,100%{translate:0 0 0}50%{translate:0 0 2.4cqw}}

.s11-lbl{position:absolute;z-index:2;translate:-50% -50%;scale:.6;opacity:0;font-family:var(--font-head);font-weight:500;font-size:clamp(15px,6.2cqw,42px);letter-spacing:-.03em;
  background:var(--ink);color:#fff;padding:.12em .45em;border-radius:12px;white-space:nowrap;
  transition:opacity .5s ease var(--d),scale .6s cubic-bezier(.3,1.6,.5,1) var(--d)}
.s11-chart3d.in .s11-lbl{opacity:1;scale:1}
.s11-chart3d .sq{position:absolute}

.s11-panel{background:#fff;border-radius:var(--r);padding:clamp(18px,2vw,34px);box-shadow:0 10px 40px rgba(40,90,110,.13)}
.s11-mgr{grid-area:mgr;justify-self:end}
.s11-med{grid-area:med;justify-self:start}
.s11-dig{grid-area:dig;justify-self:start;align-self:end;margin-right:calc(-1 * clamp(0px,2vw,40px))}
.s11-pills{display:flex;flex-wrap:wrap;gap:clamp(8px,.8vw,14px)}
.s11-pills.col{flex-direction:column;align-items:flex-start}
.s11 .pill{font-size:clamp(14px,1.35vw,23px);padding:.22em .9em;transition:background .25s,color .25s}
.s11 .pill:hover{background:var(--ink);color:#fff}
.s11-ph{display:none}

@media (max-width:980px){
  .s11-map{grid-template-columns:1fr;grid-template-areas:"ring" "mgr" "med" "dig"}
  .s11-chart3d{width:min(78vw,420px);justify-self:center;margin-bottom:10px}
  .s11-mgr,.s11-med,.s11-dig{justify-self:stretch;margin-right:0}
  .s11-ph{display:inline-block;font-family:var(--font-head);font-weight:600;font-size:16px;margin-bottom:12px}
  .s11-pills.col{flex-direction:row}
}
@media (prefers-reduced-motion:reduce){
  .s11-chart3d *{animation:none !important;transition:none !important}
  .s11-seg{--s11-sw:var(--sw);--s11-h:1}
  .s11-lens,.s11-lbl{opacity:1;scale:1}
}

/* 12-analytics.css */
.s12{justify-content:center}
.s12-title{max-width:72%}
.s12-grid{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(24px,5vw,110px);align-items:stretch}
.s12-src{list-style:none;display:grid;gap:clamp(10px,1.2vw,22px)}
.s12-src li{display:grid;place-items:center;min-height:clamp(64px,6.6vw,120px);border:1.3px solid var(--ink);border-radius:var(--r-md);
  background:linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.75) 55%,#fff 100%);
  font-family:var(--font-head);font-weight:500;font-size:clamp(26px,3.2vw,60px);letter-spacing:-.03em;color:var(--coral);padding:.1em .4em;text-align:center}
.s12-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,2.2vw,46px)}
.s12-item{background:#fff;border-radius:var(--r-md);padding:clamp(18px,2vw,34px);display:flex;flex-direction:column;gap:clamp(14px,2vw,34px);
  box-shadow:0 14px 40px rgba(60,100,120,.1);transition:box-shadow .35s ease}
.s12-item:hover{box-shadow:0 20px 50px rgba(60,100,120,.2)}
.s12-n{display:flex;align-items:center;gap:.6em;font-family:var(--font-head);font-weight:400;font-size:clamp(18px,1.7vw,30px);color:#9fbccc}
.s12-n::after{content:"";flex:1;height:1.5px;background:#b7cfda;border-radius:2px}
@media (max-width:980px){
  .s12-title{max-width:none}
  .s12-grid{grid-template-columns:1fr}
}
@media (max-width:640px){ .s12-items{grid-template-columns:1fr} }

/* 13-clients.css */
.s13{justify-content:center}
.s13-akar,.s13-grid{max-width:1560px}
.s13-akar{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(18px,4vw,80px);align-items:center;background:#d9ecf2;border-radius:var(--r);
  padding:clamp(22px,3vw,52px) clamp(22px,3.4vw,56px)}
.s13-akar img{width:min(100%,400px);height:auto}
.s13-akar .sub{font-weight:500;font-size:clamp(17px,1.8vw,32px);line-height:1.1}
.s13-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.6vw,46px) clamp(16px,3.4vw,70px)}
.s13-logo{position:relative;display:grid;place-items:center;aspect-ratio:475/168;border:1.3px solid var(--ink);border-radius:var(--r-md);background:#fff;
  padding:clamp(16px,2vw,32px) clamp(24px,3vw,56px) clamp(24px,2.6vw,40px)}
.s13-logo img{max-width:100%;max-height:clamp(40px,5vw,96px);width:auto;height:auto;object-fit:contain;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.s13-logo:hover img{transform:scale(1.06)}
.s13-logo figcaption{position:absolute;left:clamp(14px,1.8vw,34px);bottom:0;translate:0 50%;background:#d9ecf2;border-radius:999px;padding:.3em .9em;
  font-size:clamp(12px,1vw,17px);white-space:nowrap}
@media (max-width:980px){ .s13-akar{grid-template-columns:1fr} .s13-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:560px){ .s13-grid{grid-template-columns:1fr} }

/* 14-dividers.css */
.divider{min-height:100vh;justify-content:flex-end;padding-bottom:clamp(40px,9vh,110px)}
.divider-title{font-size:clamp(64px,13vw,250px);text-transform:uppercase;letter-spacing:-.05em;line-height:.85}
.divider-line{display:flex;align-items:center;flex-wrap:wrap;gap:clamp(14px,2.5vw,40px)}
.hcp-chip{font-family:var(--font-head);font-weight:800;font-size:clamp(34px,6vw,110px);letter-spacing:-.04em;background:var(--ink);color:#fff;border-radius:clamp(14px,1.6vw,28px);padding:.08em .3em .12em}
.div-special{justify-content:flex-end}
.div-special .divider-title{font-size:clamp(34px,8.2vw,168px)}

/* 15-gastro-launch.css */
.s15{justify-content:center}
.s15-head{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(12px,2vw,36px);padding-right:clamp(90px,10vw,140px)}
.s15 .s15-tag{color:var(--ink);font-size:clamp(20px,2.4vw,42px);border-radius:14px;padding:.12em .55em}
.s15 .s15-tt{font-weight:700}
.s15-groups{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.55fr);gap:clamp(18px,3vw,56px);align-items:start}
.s15-grp{display:flex;flex-direction:column}
.s15-grp-head{display:flex;align-items:flex-start;gap:clamp(12px,2vw,30px);padding-left:clamp(14px,2.4vw,44px)}
.s15-grp-head .tag{position:relative;z-index:1}
.s15-line{flex:1;margin-top:calc(clamp(15px,1.35vw,23px)*.8);height:clamp(24px,2.4vw,40px);border-top:1.5px solid rgba(255,255,255,.9);border-right:1.5px solid rgba(255,255,255,.9);border-top-right-radius:var(--r-md)}
.s15-grp-body{border:1.5px solid rgba(255,255,255,.9);border-top:none;border-radius:0 0 var(--r-md) var(--r-md);padding:0 clamp(14px,2.4vw,44px) clamp(16px,2.4vw,40px);display:grid;gap:clamp(12px,1.4vw,22px)}
.s15-crit{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);align-items:center}
.s15-crit .s15-common{grid-column:2;grid-row:1 / span 2;align-self:center}
.s15 .tile.glass{background:rgba(255,255,255,.42);box-shadow:0 8px 30px rgba(120,80,100,.08)}
.s15 .tile.soft{background:rgba(220,236,242,.6)}
@media (max-width:980px){
  .s15-groups{grid-template-columns:1fr}
}
@media (max-width:640px){
  .s15-crit{grid-template-columns:1fr}
  .s15-crit .s15-common{grid-column:auto;grid-row:auto}
  .s15-head{padding-right:0;margin-top:44px}
}

/* 16-gastro-results.css */
.s16{justify-content:center}
.s16-head{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(12px,2.4vw,44px);padding-right:clamp(90px,10vw,140px)}
.s16 .s16-tag{font-size:clamp(20px,2.4vw,42px);border-radius:14px;padding:.12em .7em}
/* верхние KPI в контурных рамках */
.s16-kpis{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:clamp(10px,1.2vw,20px)}
.s16-kpi{display:flex;flex-wrap:wrap;align-items:baseline;gap:.3em 1em;border:1.5px solid var(--ink);border-radius:var(--r-sm);padding:clamp(10px,1vw,16px) clamp(14px,1.4vw,24px)}
.s16-kpi-l{font-family:var(--font-head);font-weight:500;letter-spacing:-.01em}
.s16-kpi-n{font-weight:700;white-space:nowrap}
.s16-kpi-n small{font-size:.55em}
/* основная сетка */
.s16-body{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,2.15fr) minmax(0,1fr);gap:clamp(14px,1.8vw,30px);align-items:stretch}
.s16-how{background:linear-gradient(160deg,#fde1df 0%,#fbc3bd 55%,#f8968d 100%);border-radius:var(--r-md);padding:clamp(20px,2.2vw,40px);font-family:var(--font-head);font-weight:500;font-size:clamp(14px,1.1vw,19px);line-height:1.3;letter-spacing:-.01em;gap:1.1em;align-content:center}
.s16-mid{display:flex;flex-direction:column;gap:clamp(12px,1.4vw,22px)}
.s16-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,1vw,16px)}
.s16-stat{position:relative;display:flex;align-items:center;gap:14px;border:1.5px solid var(--ink);border-radius:var(--r-sm);padding:clamp(10px,.9vw,14px)}
.s16-stat:nth-child(n+3){padding-top:clamp(24px,2vw,32px)}
.s16 .s16-b{font-family:var(--font-head);font-weight:500;letter-spacing:-.01em}
.s16 .s16-chip{font-weight:700;font-size:clamp(22px,2.1vw,36px);color:#fff;padding:.18em .5em;min-width:3.6em;justify-content:center}
.s16-mini{position:absolute;top:8px;left:10px;background:var(--ink);color:#fff;font-family:var(--font-head);font-weight:600;font-size:clamp(10px,.8vw,13px);padding:2px 6px;border-radius:4px}
.s16-rub{width:clamp(36px,3vw,48px);flex:none}
.s16-rub svg{width:100%;height:auto;display:block}
/* схема Потребители — сайт — Врачи */
.s16-scheme{flex:1;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:clamp(8px,1vw,16px);background:#d6e9ef;border-radius:var(--r-md);padding:clamp(16px,1.8vw,28px)}
.s16-side .h3{font-weight:600}
.s16-right{text-align:left}
.s16-hub{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.s16-hub-l{color:#5d7480;font-family:var(--font-head);font-weight:500}
.s16-hub-ico{width:clamp(76px,7vw,112px);aspect-ratio:1.2;border-radius:var(--r-sm);background:#fff;display:grid;place-items:center;box-shadow:0 10px 30px rgba(40,100,120,.15)}
.s16-hub-ico svg{width:62%;height:auto}
/* таблица продаж */
.s16-sales{background:#e4f0f3;border-radius:var(--r-md);overflow:hidden;display:flex;flex-direction:column}
.s16-sales-h{background:var(--teal);color:#fff;text-align:center;font-family:var(--font-head);font-weight:500;font-size:clamp(17px,1.5vw,26px);padding:.5em}
/* ---------- объёмная мини-диаграмма продаж (CSS 3D): кубики-столбики на наклонной плоскости ---------- */
@property --s16-g{syntax:'<number>';inherits:false;initial-value:0}
@property --s16-b{syntax:'<number>';inherits:false;initial-value:1}
.s16-chart3d{position:relative;width:100%;aspect-ratio:2.15;container-type:inline-size;margin:2px 0}
.s16-stage{position:absolute;inset:0;perspective:200cqw;perspective-origin:50% 40%;pointer-events:none}
.s16-stage *{position:absolute;box-sizing:border-box;transform-style:preserve-3d}
.s16-plane{left:9cqw;top:calc(60% - 10cqw);width:82cqw;height:20cqw;transform:rotateX(58deg) rotateZ(10deg);animation:s16sway 14s ease-in-out infinite alternate}
.s16-floor{left:-3%;right:-3%;top:0;bottom:0;border-radius:2.4cqw;
  background:linear-gradient(160deg, rgba(255,255,255,.9), rgba(255,255,255,.45));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.95), 0 3cqw 6cqw rgba(30,90,110,.14)}
.s16-floor::after{content:"";position:absolute;inset:0;border-radius:inherit;background:#bcd8df;transform:translateZ(-1cqw)}
.s16-glow{left:calc(92.94% - 11cqw);top:calc(50% - 11cqw);width:22cqw;height:22cqw;border-radius:50%;opacity:0;transform:translateZ(.2cqw);
  background:radial-gradient(closest-side, rgba(247,118,108,.6), rgba(247,118,108,.18) 55%, rgba(247,118,108,0));transition:opacity 1s ease 1.4s}
/* столбик: --v доля от максимума (14 229), --s16-g рост при появлении, --s16-b «дыхание» */
.s16-bar{left:calc(3% + var(--i) * 10.74%);top:calc(50% - 3.3cqw);width:6.6cqw;height:6.6cqw;
  --h:calc(var(--v) * 27cqw * var(--s16-g) * var(--s16-b));
  transition:--s16-g 1s cubic-bezier(.3,1.35,.5,1) calc(.25s + var(--i) * .12s)}
.s16-tp{inset:0;border-radius:.7cqw;transform:translateZ(var(--h));
  background:linear-gradient(135deg,#c4e8ee 0%,#82c6d1 45%,#56a7b6 100%);box-shadow:inset 0 0 0 .25cqw rgba(255,255,255,.55)}
.s16-fr{left:0;top:100%;width:100%;height:var(--h);transform-origin:50% 0;transform:rotateX(90deg);
  background:linear-gradient(to bottom,#2f7482,#4e9dac)}
.s16-sd{left:100%;top:0;width:var(--h);height:100%;transform-origin:0 50%;transform:rotateY(-90deg);
  background:linear-gradient(to right,#255f6b,#3b8796)}
.s16-last .s16-tp{background:linear-gradient(135deg,#ffc2bb 0%,#ff9d94 35%,#f7766c 100%);
  box-shadow:inset 0 0 0 .25cqw rgba(255,255,255,.5), 0 0 3cqw .6cqw rgba(247,118,108,.55)}
.s16-last .s16-fr{background:linear-gradient(to bottom,#b9443c,#e8665d)}
.s16-last .s16-sd{background:linear-gradient(to right,#9e3a33,#d4554c)}
.s16-chart3d.in .s16-bar{--s16-g:1;animation:s16breath 4.4s ease-in-out calc(1.9s + var(--i) * .3s) infinite}
.s16-chart3d.in .s16-glow{opacity:1;animation:s16glow 4.4s ease-in-out 2.4s infinite}
@keyframes s16sway{from{transform:rotateX(58deg) rotateZ(7deg)}to{transform:rotateX(54deg) rotateZ(13deg)}}
@keyframes s16breath{0%,100%{--s16-b:1}50%{--s16-b:1.07}}
@keyframes s16glow{0%,100%{scale:1;opacity:1}50%{scale:1.18;opacity:.65}}
.s16-table{width:100%;border-collapse:collapse;font-size:clamp(13px,1.05vw,17px);font-variant-numeric:tabular-nums;flex:1}
.s16-table th{font-weight:500;padding:.6em .5em;background:#e4f0f3}
.s16-table td{padding:.42em .5em;text-align:center;border-top:1px solid rgba(86,167,182,.25)}
.s16-table td + td,.s16-table th + th{border-left:1px solid rgba(86,167,182,.35)}
.s16-table tbody tr:nth-child(odd){background:rgba(255,255,255,.45)}
.s16-table tbody tr:last-child td{font-weight:700;color:var(--teal-deep)}
@media (max-width:1100px){
  .s16-body{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .s16-mid{grid-column:1 / -1;grid-row:1}
}
@media (max-width:820px){
  .s16-kpis,.s16-body,.s16-stats{grid-template-columns:1fr}
  .s16-mid{grid-column:auto;grid-row:auto}
  .s16-scheme{grid-template-columns:1fr}
  .s16-hub{flex-direction:row;flex-wrap:wrap}
  .s16-head{padding-right:0;margin-top:44px}
}
@media (prefers-reduced-motion:reduce){
  .s16-chart3d *{animation:none !important;transition:none !important}
  .s16-bar{--s16-g:1}
  .s16-glow{opacity:1}
}

/* 17-ophthalmo-channels.css */
.s17{justify-content:center}
.s17-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3.1fr);gap:clamp(18px,3.5vw,64px);align-items:start}
.s17 .s17-note{background:#fff;border-radius:var(--r);padding:clamp(22px,2.6vw,48px);box-shadow:0 14px 40px rgba(150,90,110,.12)}
.s17-timeline{list-style:none;position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1.4vw,26px)}
/* общая линия таймлайна на уровне точек */
.s17-timeline::before{content:"";position:absolute;left:-3%;right:0;bottom:calc(clamp(14px,1.25vw,21px)*1.5 + 14px);height:2px;background:rgba(255,255,255,.95);border-radius:2px}
.s17-step{position:relative;display:flex;flex-direction:column;align-items:center}
.s17-ch{width:100%;flex:1;background:rgba(255,255,255,.22);border:1.5px solid rgba(255,255,255,.85);border-radius:var(--r-md);padding:clamp(14px,1.4vw,24px) clamp(12px,1.2vw,20px);gap:.3em;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.s17-ch mark{color:var(--ink);font-weight:600;padding:.02em .3em;border-radius:6px;margin-left:-.3em}
.s17-ch mark.s17-new{background:var(--teal)}
.s17-ch mark.s17-moved{background:#f3cde2}
.s17-stem{width:2px;height:clamp(28px,4vw,72px);background:rgba(255,255,255,.95)}
.s17-dot{width:14px;height:14px;border-radius:50%;background:#f3cde2;border:3px solid #fff;margin-top:-1px;box-shadow:0 0 0 4px rgba(255,255,255,.35)}
.s17 .s17-month{margin-top:8px;line-height:1.2;font-size:clamp(14px,1.25vw,21px);border-radius:6px;padding:.15em .4em}
@media (max-width:1100px){
  .s17-body{grid-template-columns:1fr}
}
@media (max-width:820px){
  .s17-timeline{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}
  .s17-timeline::before{display:none}
  .s17-stem{height:16px}
}
@media (max-width:480px){
  .s17-timeline{grid-template-columns:1fr}
}

/* 18-ophthalmo-results.css */
.s18{justify-content:center}
.s18-head{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(12px,1.6vw,28px);padding-right:clamp(90px,24vw,420px)}
.s18 .s18-tag{font-size:clamp(20px,2.4vw,42px);border-radius:14px;padding:.12em .7em}
.s18-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.85fr);gap:clamp(18px,3vw,56px);align-items:stretch}
.s18 .s18-sum{background:#d6e9ef;border-radius:var(--r);padding:clamp(22px,2.4vw,44px) clamp(20px,2vw,36px);font-size:clamp(15px,1.3vw,22px);gap:1.2em;align-content:center}
.s18 .s18-sum b{font-weight:600}
.s18-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.3vw,22px)}
.s18-card{border:1.5px solid var(--ink);border-radius:var(--r-md);padding:clamp(16px,1.6vw,28px) clamp(18px,1.8vw,32px);background:#fff;display:flex;flex-direction:column;justify-content:center}
.s18-split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(12px,1.4vw,24px);align-items:center}
.s18 .s18-n{font-weight:700;white-space:nowrap}
.s18 .s18-n small{font-size:.55em}
.s18 .s18-cap{font-weight:600;margin-top:.25em}
.s18 .s18-lead-t{font-weight:800}
@media (max-width:1100px){
  .s18-body{grid-template-columns:1fr}
}
@media (max-width:820px){
  .s18-grid{grid-template-columns:1fr}
  .s18-head{padding-right:0;margin-top:44px}
}
@media (max-width:480px){
  .s18-split{grid-template-columns:1fr}
}

/* 19-hypothyroid.css */
.s19{justify-content:center}
.s19-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:clamp(20px,3.5vw,64px);align-items:end}
/* группы «Задачи» / «Решение» — контур с плашкой, врезанной в верхнюю линию */
.s19-grp{display:flex;flex-direction:column}
.s19-grp-head{display:flex;align-items:flex-start;gap:clamp(12px,2vw,30px);padding-left:clamp(14px,2.4vw,44px)}
.s19-line{flex:1;margin-top:calc(clamp(15px,1.35vw,23px)*.8);height:clamp(20px,2vw,32px);border-top:1.5px solid rgba(255,255,255,.9);border-right:1.5px solid rgba(255,255,255,.9);border-top-right-radius:var(--r-md)}
.s19 .s19-grp-body{border:1.5px solid rgba(255,255,255,.9);border-top:none;border-radius:0 0 var(--r-md) var(--r-md);padding:4px clamp(16px,2.4vw,44px) clamp(16px,2vw,30px);gap:.6em;font-size:clamp(14px,1.2vw,20px)}
.s19-grp-head .tag{font-size:clamp(18px,1.8vw,30px)}
/* результаты */
.s19-right{display:flex;flex-direction:column;align-items:flex-start}
.s19 .s19-rtag{font-size:clamp(18px,1.8vw,30px);position:relative;z-index:1;margin-left:clamp(10px,1vw,18px);margin-bottom:-.6em}
.s19-res{width:100%;background:#fff;border-radius:var(--r);padding:clamp(28px,3vw,52px) clamp(16px,2.4vw,44px) clamp(18px,2.2vw,40px);display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(10px,1vw,18px);box-shadow:0 16px 40px rgba(60,110,130,.12)}
.s19-m{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(8px,.9vw,14px);border:1.2px solid var(--ink);border-radius:var(--r-sm);padding:6px 12px 6px 6px;min-width:0}
.s19-m .h4{font-weight:600;line-height:1.1}
.s19 .s19-chip{font-weight:700;font-size:clamp(18px,1.8vw,34px);border-radius:10px;padding:.1em .35em}
.s19-bottom{width:100%;display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);align-items:center;gap:clamp(10px,1vw,18px);margin-top:clamp(12px,1.4vw,24px)}
.s19-laptop{filter:drop-shadow(0 22px 30px rgba(40,60,80,.25));margin-right:clamp(-60px,-3vw,0px)}
/* фон картинки чёрный — оставляем только силуэт ноутбука (крышка + основание) */
.s19-laptop img{width:100%;height:auto;clip-path:polygon(11.3% 7%,11.7% 5.6%,12.6% 4.9%,88.9% 4.9%,89.6% 5.6%,89.9% 7%,89.9% 90.6%,96% 91.6%,97.4% 93.5%,97.4% 95.2%,95.4% 96.4%,4.5% 96.4%,2.6% 95.2%,2.5% 93.5%,4% 91.6%,11.3% 90.6%)}
.s19-up{display:flex;flex-direction:column;gap:clamp(10px,1vw,18px)}
.s19-up-card{background:var(--coral);color:#fff;border-radius:var(--r-md);padding:clamp(16px,1.6vw,28px);display:flex;flex-direction:column;gap:.35em}
.s19-up-card .num-l{font-weight:700}
.s19-up-card .h4{font-weight:600}
@media (max-width:1100px){
  .s19-grid{grid-template-columns:1fr;align-items:start}
}
@media (max-width:640px){
  .s19-res,.s19-bottom{grid-template-columns:1fr}
  .s19-up{flex-direction:row}
  .s19-up-card{flex:1}
  .s19-laptop{margin-right:0}
  .s19 > .s19-grid{margin-top:44px}
}

/* 20-brand-platform.css */
.s20{justify-content:center}
.s20-head .sub{margin-top:.35em}
.s20-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(20px,4vw,80px);align-items:start;max-width:1500px}
.s20-left{display:flex;flex-direction:column;gap:clamp(26px,3vw,46px)}
.s20-box{position:relative;border:1.5px solid rgba(255,255,255,.75);border-radius:var(--r-md);background:rgba(255,255,255,.28);padding:clamp(30px,2.8vw,44px) clamp(18px,2vw,34px) clamp(16px,1.6vw,26px)}
.s20-box > .tag{position:absolute;top:0;left:-2px;transform:translateY(-55%)}
.s20-sol{position:relative;padding-top:clamp(18px,1.6vw,26px)}
.s20-sol > .tag{position:absolute;top:0;left:clamp(0px,.5vw,8px);z-index:1}
.s20-sol .tile{padding:clamp(30px,2.8vw,48px) clamp(20px,2.4vw,44px);box-shadow:0 10px 40px rgba(30,80,95,.12)}
.s20 .list{gap:.55em}
@media (max-width:820px){
  .s20-grid{grid-template-columns:1fr}
}

/* 21-brand-platform-results.css */
.s21{justify-content:center}
.s21-title{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(14px,3vw,60px)}
.s21-tag{font-size:clamp(20px,2.4vw,44px);padding:.15em .9em;border-radius:14px}
.s21-head .sub{margin-top:.35em}
.s21-grid{display:grid;grid-template-columns:minmax(0,.32fr) minmax(0,1fr);gap:clamp(24px,4vw,80px);align-items:start}
.s21-stats{display:flex;flex-direction:column}
.s21-stat{padding:clamp(14px,1.6vw,26px) 0;border-bottom:1.5px solid var(--teal-soft)}
.s21-stat:first-child{padding-top:0}
.s21-stat:last-child{border-bottom:0}
.s21-stat .txt{margin-top:.5em}
.s21-cost{display:flex;align-items:center;gap:clamp(14px,2.4vw,44px);flex-wrap:wrap}
.s21-cost .txt{flex:1;min-width:240px;max-width:780px}

/* схема-воронка: шаги зигзагом, стрелки чередуют вниз/вверх */
.s21-flow{--gx:clamp(26px,2.4vw,40px);--gy:clamp(30px,3vw,48px);margin-top:clamp(20px,2.6vw,44px);background:#fff;border-radius:var(--r-md);box-shadow:0 8px 40px rgba(40,90,110,.12);
  padding:clamp(22px,2.4vw,40px) clamp(22px,2.4vw,40px) clamp(22px,2.4vw,40px) calc(clamp(22px,2.4vw,40px) + 22px);
  display:grid;grid-template-columns:repeat(8,minmax(0,1fr));column-gap:var(--gx);row-gap:var(--gy)}
.s21-step{position:relative;border:1.3px solid var(--ink);border-radius:var(--r-sm);padding:clamp(12px,1.1vw,18px) clamp(12px,1.2vw,18px) clamp(12px,1.1vw,18px) clamp(34px,2.6vw,46px);min-height:clamp(80px,6.4vw,112px);display:flex;align-items:center}
.s21-step .small{line-height:1.25}
.s21-step b{font-weight:600}
.s21-ico{position:absolute;left:0;top:50%;transform:translate(-50%,-50%);width:clamp(40px,3.2vw,54px);aspect-ratio:1;border-radius:12px;background:var(--teal-soft);display:grid;place-items:center;color:var(--ink)}
.s21-ico svg{width:60%;height:60%}
.st1{grid-column:1/4;grid-row:1}
.st2{grid-column:2/5;grid-row:2}
.st3{grid-column:4/7;grid-row:1}
.st4{grid-column:5/8;grid-row:2}
.st5{grid-column:6/9;grid-row:1;margin-left:calc(var(--gx) * -0.2)}
/* стрелки */
.st2::before,.st3::before,.st4::before,.st5::before{content:"";position:absolute;width:calc(var(--gx) + 6px);right:calc(100% + 30px);border:1.3px solid #9fbfca;border-right:0;pointer-events:none;
  transform-origin:right center;transform:scaleX(0);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.st2::before,.st4::before{bottom:50%;height:calc(50% + var(--gy));border-top:0;border-bottom-left-radius:16px}
.st3::before,.st5::before{top:50%;height:calc(50% + var(--gy));border-bottom:0;border-top-left-radius:16px}
.st2::after,.st3::after,.st4::after,.st5::after{content:"";position:absolute;right:calc(100% + 30px);top:50%;width:8px;height:8px;border-top:1.3px solid #9fbfca;border-right:1.3px solid #9fbfca;transform:translate(1px,-50%) rotate(45deg);opacity:0;transition:opacity .3s}
.s21-flow.in .s21-step::before{transform:none}
.s21-flow.in .s21-step::after{opacity:1}
.s21-flow.in .st2::before,.s21-flow.in .st2::after{transition-delay:.5s}
.s21-flow.in .st3::before,.s21-flow.in .st3::after{transition-delay:.8s}
.s21-flow.in .st4::before,.s21-flow.in .st4::after{transition-delay:1.1s}
.s21-flow.in .st5::before,.s21-flow.in .st5::after{transition-delay:1.4s}

@media (max-width:1100px){
  .s21-grid{grid-template-columns:1fr}
  .s21-stats{flex-direction:row;flex-wrap:wrap;gap:24px 40px}
  .s21-stat{border:0;padding:0}
}
@media (max-width:820px){
  .s21-flow{grid-template-columns:1fr;row-gap:22px;padding-left:44px}
  .st1,.st2,.st3,.st4,.st5{grid-column:1;grid-row:auto;margin-left:0}
  .st2::before,.st3::before,.st4::before,.st5::before{right:auto;left:clamp(20px,1.6vw,27px);top:auto;bottom:100%;width:0;height:22px;border:0;border-left:1.3px solid #9fbfca;border-radius:0;transform:scaleY(0);transform-origin:top}
  .st2::after,.st3::after,.st4::after,.st5::after{display:none}
  .s21-stats{flex-direction:column}
}

/* читаемость текста на плашках воронки */
.s21-step .small{font-size:clamp(15px,1.18vw,19px);line-height:1.32;color:#1f262c;letter-spacing:.005em}
.s21-step b{display:inline-block;margin-bottom:.15em;font-family:var(--font-head);font-weight:600;font-size:1.04em;letter-spacing:-.01em;color:#0b0b0c}
.s21-step.st1 .small{font-family:var(--font-head);font-weight:500;font-size:clamp(14px,1.08vw,17.5px);line-height:1.35;color:#0b0b0c}
.s21-step{min-height:clamp(88px,7vw,124px)}
.s21-step:not(.st1) .small::first-line{font-family:var(--font-head);font-weight:600;color:#0b0b0c}
/* зигзаг без нахлёста: 12 колонок, ряд 1 — три шага подряд, ряд 2 — два шага между ними */
@media (min-width:1101px){
  .s21-flow{grid-template-columns:repeat(12,minmax(0,1fr))}
  .st1{grid-column:1/5}.st3{grid-column:5/9}.st5{grid-column:9/13;margin-left:0}
  .st2{grid-column:3/7}.st4{grid-column:7/11}
}

/* 22-derma-portfolio.css */
.s22{justify-content:center}
.s22 header .sub{margin-top:.35em}
.s22-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,4vw,90px);align-items:stretch;max-width:1600px}
.s22-col{position:relative;display:flex;flex-direction:column;padding-top:clamp(20px,1.8vw,30px)}
.s22-col > .tag{position:absolute;top:0;left:clamp(14px,2vw,40px);z-index:1;font-size:clamp(17px,1.6vw,28px)}
.s22-tile{flex:1;padding:clamp(30px,2.8vw,46px) clamp(20px,2.4vw,46px) clamp(20px,2.2vw,36px);box-shadow:0 10px 40px rgba(30,80,95,.12)}

/* вводные */
.s22-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(14px,2vw,30px);align-items:end}
.s22-brands{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px}
.s22-brands .h2{font-weight:500;letter-spacing:-.03em}
.s22-pill{font-family:var(--font-head);font-weight:600;font-size:clamp(13px,1.1vw,18px);border:1.3px solid var(--ink);border-radius:8px;padding:.2em .5em;white-space:nowrap}
.s22-in b{font-weight:600}
.s22-table{border-collapse:separate;border-spacing:0;border:1.2px solid #d5e4e9;border-radius:10px;overflow:hidden;width:100%;max-width:300px}
.s22-table th{font-weight:500;padding:.35em .8em;text-align:left}
.s22-table td{padding:.35em .8em;border-top:1.2px solid #d5e4e9}
.s22-table th + th,.s22-table td + td{border-left:1.2px solid #d5e4e9}
.s22-table i{display:inline-block;width:.8em;height:.8em;border-radius:3px;margin-right:.4em;vertical-align:-.05em}
.s22-st{display:inline-block;min-width:4.5em;padding:0 .3em;border-radius:4px;background:linear-gradient(90deg,transparent 40%,#eaf3f5 40%)}
.s22-st.rx{background:linear-gradient(90deg,#d3e8ec,#b3d6de)}
/* ---------- объёмное кольцо портфеля (CSS 3D): ломтики из стопки слоёв, вращается ---------- */
@property --s22-sw{syntax:'<angle>';inherits:true;initial-value:0deg}
@property --s22-h{syntax:'<number>';inherits:true;initial-value:0}
.s22-chart3d{position:relative;width:100%;max-width:300px;aspect-ratio:1/.78;justify-self:center;container-type:inline-size}
.s22-stage{position:absolute;inset:0;perspective:180cqw;perspective-origin:50% 45%;pointer-events:none}
.s22-stage *{position:absolute;box-sizing:border-box;transform-style:preserve-3d}
.s22-tilt{left:8cqw;top:calc(45% - 42cqw);width:84cqw;height:84cqw;transform:rotateX(55deg) rotateZ(-10deg)}
.s22-spin{inset:0;animation:s22spin 48s linear infinite}
.s22-shadow{inset:-2%;border-radius:50%;transform:translateZ(-1cqw);
  background:radial-gradient(closest-side, rgba(25,70,90,.18) 60%, rgba(25,70,90,.07) 82%, rgba(25,70,90,0) 100%)}
/* подложки-дорожки (как в исходной диаграмме) */
.s22-track{inset:0;border-radius:50%}
.s22-track-o{background:#e6f0f3;
  -webkit-mask:radial-gradient(closest-side, transparent 80%, #000 80.6%, #000 95.4%, transparent 96%);
          mask:radial-gradient(closest-side, transparent 80%, #000 80.6%, #000 95.4%, transparent 96%)}
.s22-track-i{background:#e6f0f3;
  -webkit-mask:radial-gradient(closest-side, transparent 37%, #000 37.6%, #000 42.4%, transparent 43%);
          mask:radial-gradient(closest-side, transparent 37%, #000 37.6%, #000 42.4%, transparent 43%)}
/* общие слои: --a0 начало, --sw угол, --c цвет; нижние слои темнее */
.s22-seg,.s22-arc{inset:0;--s22-sw:0deg;--s22-h:0}
.s22-seg i,.s22-arc i{inset:0;border-radius:50%;
  --lc:color-mix(in srgb, var(--c) calc(60% + var(--k) * 6%), #1f3b45);
  background:conic-gradient(from var(--a0), var(--lc) 0deg var(--s22-sw), transparent 0deg);
  -webkit-mask:var(--m);mask:var(--m);
  transform:translateZ(calc(var(--z0, 0cqw) + var(--k) * .7cqw * var(--s22-h)))}
.s22-seg i:nth-child(1),.s22-arc i:nth-child(1){--k:0}
.s22-seg i:nth-child(2),.s22-arc i:nth-child(2){--k:1}
.s22-seg i:nth-child(3){--k:2}.s22-seg i:nth-child(4){--k:3}.s22-seg i:nth-child(5){--k:4}.s22-seg i:nth-child(6){--k:5}
.s22-seg i:nth-child(7){--k:6;background:conic-gradient(from var(--a0), var(--hi) 0deg, var(--c) calc(var(--s22-sw) * .5), var(--c2) var(--s22-sw), transparent 0deg)}
.s22-seg{--m:radial-gradient(closest-side, transparent 47%, #000 47.6%, #000 76.4%, transparent 77%);
  transition:--s22-sw 1.2s cubic-bezier(.4,0,.2,1) calc(.15s + var(--i) * .3s),--s22-h .9s cubic-bezier(.3,1.5,.5,1) calc(.3s + var(--i) * .3s)}
.s22-cr{--a0:271deg;--sw:117deg;--c:#b3cdd7;--hi:#dbeaf0;--c2:#a3c1cd;--dx:-1.8cqw;--dy:-3cqw}
.s22-cp{--a0:30deg;--sw:120deg;--c:#4f9fb0;--hi:#8fcfd8;--c2:#448e9e;--dx:3.5cqw;--dy:0cqw}
.s22-oi{--a0:152deg;--sw:118deg;--c:#f7766c;--hi:#f4a3ad;--c2:#e8665d;--dx:-1.8cqw;--dy:3cqw}
/* тонкие светлые дуги — парят над кольцом */
.s22-arc{transition:--s22-sw 1.1s cubic-bezier(.4,0,.2,1) var(--t),--s22-h .6s ease var(--t)}
.s22-arc i:nth-child(2){background:conic-gradient(from var(--a0), #e3f1f4 0deg, var(--c) var(--s22-sw), transparent 0deg)}
.s22-arc-o{--a0:28deg;--sw:110deg;--c:#c7e1e7;--z0:6cqw;--t:1s;
  --m:radial-gradient(closest-side, transparent 85%, #000 85.6%, #000 94.4%, transparent 95%)}
.s22-arc-i{--a0:50deg;--sw:95deg;--c:#c7e1e7;--z0:4cqw;--t:1.2s;
  --m:radial-gradient(closest-side, transparent 34%, #000 34.6%, #000 45.4%, transparent 46%)}
.s22-chart3d.in .s22-seg{--s22-sw:var(--sw);--s22-h:1;animation:s22pop 9s ease-in-out calc(2.4s + var(--i) * 3s) infinite}
.s22-chart3d.in .s22-arc{--s22-sw:var(--sw);--s22-h:1;animation:s22float 7s ease-in-out 2.4s infinite}
.s22-chart3d.in .s22-arc-i{animation-delay:-1.2s}
@keyframes s22spin{to{transform:rotateZ(360deg)}}
@keyframes s22pop{0%,40%,100%{translate:0 0 0}14%,26%{translate:var(--dx) var(--dy) 3cqw}}
@keyframes s22float{0%,100%{translate:0 0 0}50%{translate:0 0 2.6cqw}}

/* решение */
.s22-sol{display:flex;flex-direction:column;justify-content:space-between;gap:clamp(16px,1.8vw,28px)}
.s22-item{display:flex;align-items:center;gap:clamp(16px,2.4vw,44px)}
.s22-ico{flex:none;width:clamp(64px,7vw,128px);aspect-ratio:1.4;border-radius:12px;background:var(--teal-soft);display:grid;place-items:center}
.s22-ico svg{width:52%;height:auto}
.s22-name{font-size:clamp(22px,2.2vw,40px);font-weight:500;letter-spacing:-.02em;margin-bottom:.15em}
.s22-item .txt{padding-left:clamp(0px,2.6vw,50px)}

@media (max-width:1100px){
  .s22-in{grid-template-columns:1fr}
  .s22-chart3d{max-width:240px}
}
@media (max-width:820px){
  .s22-grid{grid-template-columns:1fr;gap:40px}
  .s22-item .txt{padding-left:0}
}
@media (prefers-reduced-motion:reduce){
  .s22-chart3d *{animation:none !important;transition:none !important}
  .s22-seg,.s22-arc{--s22-sw:var(--sw);--s22-h:1}
}

/* 23-derma-otc.css */
.s23{justify-content:center}
.s23-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr);gap:clamp(24px,3.4vw,64px);align-items:stretch}
.s23-left{display:flex;flex-direction:column;gap:clamp(28px,3vw,50px);min-width:0}
.s23-tasks{display:flex;flex-wrap:wrap;gap:16px clamp(20px,3.4vw,60px);align-items:flex-start}
.s23-tasks .h4 b{font-weight:700}

/* графики */
.s23-charts{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(18px,2.6vw,46px);background:#fff;border-radius:var(--r-md);box-shadow:0 8px 40px rgba(40,90,110,.14);padding:clamp(30px,2.6vw,44px) clamp(16px,2vw,34px) clamp(16px,1.6vw,24px)}
.s23-year{position:absolute;top:0;left:clamp(26px,2.6vw,44px);transform:translateY(-50%);background:var(--ink);color:#fff;font-family:var(--font-head);font-weight:700;font-size:clamp(13px,1.1vw,18px);padding:.25em .6em;border-radius:6px}
.s23-chart{display:flex;flex-direction:column;min-width:0}
.s23-chart figcaption{font-family:var(--font-head);font-weight:500;text-align:center;font-size:clamp(11px,.85vw,14px);min-height:2.6em}
/* объёмные графики: общий компонент .b3d-* (29-bars3d.css), здесь — только настройки */
.s23-chart3d{margin-top:clamp(4px,.6vw,10px);
  --b3d-w:88cqw;--b3d-h:52cqw;--b3d-d:3.4cqw;--b3d-fd:7cqw;--b3d-gap:2.5cqw;--b3d-px:3%;--b3d-pt:8cqw;
  --b3d-wall:linear-gradient(180deg,#f8fbfc,#edf5f7);--b3d-grid:#e0ecef;--b3d-vgrid:transparent;--b3d-rows:25%;
  --b3d-floor:linear-gradient(180deg,#e6f0f3,#f6fafb);--b3d-edge:linear-gradient(180deg,#cfe0e5,#e4eef1);
  --b3d-fv:clamp(7px,2.3cqw,12px);--b3d-vc:var(--ink);--b3d-fm:clamp(8px,2.5cqw,12px);--b3d-fi:clamp(7px,2.5cqw,12px)}
.s23-chart3d .b3d-m{color:#5a6a70}
/* короткие подписи месяцев: наискосок — только на совсем узком графике */
@container (min-width:300px){
  .s23-chart3d .b3d-scene{padding-bottom:calc(var(--b3d-fd) * .45 + 2.8em)}
  .s23-chart3d .b3d-m{--rz:0deg;left:-50%;right:-50%;text-align:center;transform-origin:50% 0;padding-top:calc(var(--b3d-slab,1cqw) + .5em)}
}
.s23-legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:clamp(6px,.8vw,12px);font-size:clamp(9px,.68vw,11px);font-weight:600}
.s23-legend i{display:inline-block;width:.95em;height:.95em;border-radius:2px;margin-right:.4em;vertical-align:-.12em}
.lg-pos{background:#56a7b6}.lg-neg{background:var(--coral)}.lg-none{background:#e8f0f2}
.lg-tot{background:linear-gradient(180deg,#f7837a,#d8eaef)}

/* результаты */
.s23-res{display:flex;flex-direction:column;justify-content:space-around;padding-top:clamp(40px,3.6vw,60px);margin-top:clamp(14px,1.4vw,24px)}
.s23-res-tag{position:absolute;top:0;left:clamp(30px,3vw,60px);transform:translateY(-55%);font-size:clamp(18px,1.9vw,34px);padding:.15em .8em;border-radius:12px}
.s23-r{padding:clamp(14px,1.6vw,26px) 0;border-bottom:1.5px solid var(--teal-soft)}
.s23-r:last-child{border-bottom:0}
.s23-r .txt{margin-top:.4em}
.s23-r2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,36px)}
.s23-r2 > div + div{border-left:1.5px solid var(--teal-soft);padding-left:clamp(14px,2vw,36px)}
.s23-res .num-l{font-weight:600}

@media (max-width:1100px){
  .s23-grid{grid-template-columns:1fr}
}
@media (max-width:820px){
  .s23-charts{grid-template-columns:1fr;gap:36px}
}
@media (max-width:520px){
  .s23-r2{grid-template-columns:1fr}
  .s23-r2 > div + div{border-left:0;padding-left:0}
}

/* 24-derma-seeding.css */
.s24{justify-content:center}
.s24-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,.27fr);gap:clamp(20px,3vw,60px);align-items:end}
.s24-main{min-width:0}
.s24-bar{display:flex;flex-wrap:wrap;align-items:center;gap:14px clamp(20px,3vw,56px);border:1.3px solid rgba(11,11,12,.75);border-radius:var(--r-md);padding:8px clamp(14px,2.2vw,40px) 8px 8px;max-width:1100px}
.s24-seed{background:#fff;border-radius:var(--r-sm);font-family:var(--font-head);font-weight:500;font-size:clamp(24px,2.6vw,46px);letter-spacing:-.03em;padding:.2em .6em}
.s24-bar .lead{line-height:1.15}
.s24-grid{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1fr);gap:clamp(20px,3.4vw,70px);align-items:start}
.s24-panel{position:relative;background:rgba(255,255,255,.22);border-radius:var(--r-md);padding:clamp(30px,2.6vw,44px) clamp(18px,2vw,30px) clamp(18px,1.8vw,30px);margin-top:clamp(14px,1.2vw,20px)}
.s24-panel > .tag,.s24-res > .tag{position:absolute;top:0;left:clamp(14px,1.6vw,26px);transform:translateY(-50%);font-size:clamp(17px,1.7vw,30px)}
.s24-res{position:relative;border-radius:var(--r-md);background:linear-gradient(160deg,rgba(255,255,255,.82) 0%,rgba(236,244,246,.82) 55%,rgba(246,190,190,.85) 100%);padding:clamp(44px,3.6vw,64px) clamp(18px,2.6vw,50px) clamp(18px,2.6vw,50px);margin-top:clamp(14px,1.2vw,20px)}
.s24-res > .tag{left:clamp(24px,3vw,60px)}
.s24-cells{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,1vw,16px)}
.s24-cell{background:rgba(255,255,255,.75);border-radius:var(--r-sm);padding:clamp(12px,1.2vw,20px) clamp(14px,1.4vw,24px)}
.s24-cell .num-l{font-weight:600}
.s24-cell .num-l small{font-size:.45em}
.s24-cell .txt{margin-top:.2em;font-weight:500}
.s24-inline{display:flex;align-items:center;gap:clamp(10px,1.2vw,18px)}
.s24-inline .txt{margin:0}
.s24-wide{grid-column:1/-1;flex-wrap:wrap}
.s24-vk{width:clamp(36px,3vw,52px);height:auto;border-radius:12px}
.s24-posts{display:flex;flex-direction:column;gap:clamp(12px,1.4vw,22px)}
.s24-posts img{width:100%;height:auto;border-radius:var(--r-md);clip-path:inset(5% 5.6% round clamp(12px,1.3vw,20px));margin:-5.5% 0}

@media (max-width:1100px){
  .s24-layout{grid-template-columns:1fr}
  .s24-posts{flex-direction:row;max-width:620px}
  .s24-posts img{width:50%;margin:0 -2.8%}
}
@media (max-width:820px){
  .s24-grid{grid-template-columns:1fr}
}
@media (max-width:480px){
  .s24-cells{grid-template-columns:1fr}
}

/* 25-derma-cases.css */
/* Общий макет кейсов «Дерматология» (слайды 25, 26, 27): .dc + модификатор секции (.s25/.s26/.s27) */
.dc{justify-content:center;--dc-panel:rgba(255,255,255,.32);--dc-res:linear-gradient(160deg,rgba(255,255,255,.88) 0%,rgba(255,255,255,.7) 55%,rgba(250,214,210,.85) 100%)}
.dc-grid{display:grid;grid-template-columns:minmax(0,1fr) clamp(220px,19vw,340px);gap:clamp(20px,3vw,56px);align-items:center;margin-top:clamp(40px,5vw,60px)}
.dc-main{min-width:0}
.dc-title{margin-bottom:clamp(18px,2.2vw,36px)}

/* строка-мета: формат + срок + ЦА */
.dc-meta{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(12px,2.4vw,44px);border:1.5px solid var(--ink);border-radius:var(--r-md);padding:8px clamp(14px,2vw,28px) 8px 8px;max-width:1000px}
.dc-format{background:#fff;border-radius:var(--r-sm);padding:.3em .7em;font-family:var(--font-head);font-weight:500;font-size:clamp(24px,2.6vw,46px);letter-spacing:-.03em;line-height:1.1;box-shadow:0 4px 18px rgba(30,70,90,.08)}
.dc-meta .meta{font-family:var(--font-head);font-weight:500;font-size:clamp(14px,1.25vw,21px);letter-spacing:-.01em;line-height:1.2}

/* тело: задачи/решение слева, результаты справа */
.dc-body{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:clamp(16px,3vw,56px);margin-top:clamp(22px,2.8vw,44px);align-items:start}
.dc-col{display:flex;flex-direction:column;gap:clamp(16px,2vw,30px)}
.dc-panel{position:relative;background:var(--dc-panel);border-radius:var(--r-md);padding:0 clamp(16px,1.6vw,26px) clamp(16px,1.6vw,26px)}
.dc-panel > .tag{transform:translateY(-35%);margin-left:clamp(-8px,-.4vw,0px)}
.dc-panel .list{margin-top:.2em}

.dc-res{background:var(--dc-res);border-radius:var(--r);padding:0 clamp(16px,2.6vw,46px) clamp(18px,2.6vw,46px);box-shadow:0 18px 50px rgba(40,80,100,.12)}
.dc-res > .tag{transform:translateY(-40%);font-size:clamp(18px,1.7vw,30px)}
.dc-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(10px,1vw,16px);margin-top:clamp(8px,1.4vw,24px)}
.dc-stat{background:rgba(255,255,255,.78);border-radius:var(--r-sm);padding:clamp(12px,1.1vw,18px) clamp(14px,1.3vw,22px);display:flex;flex-direction:column;justify-content:center;gap:.3em;min-width:0}
.dc-stat.wide{grid-column:1/-1}
.dc-stat.inline{flex-direction:row;align-items:center;gap:clamp(10px,1.2vw,20px)}
.dc-stat .num-l{white-space:nowrap;font-size:clamp(26px,2.6vw,48px)}
.dc-stat .num-l small{font-size:.48em}
.dc-stat-txt{font-family:var(--font-head);font-weight:500;font-size:clamp(14px,1.2vw,20px);letter-spacing:-.01em;line-height:1.2}
.dc-net{width:clamp(36px,2.8vw,50px);aspect-ratio:1;flex:none;border-radius:24%;overflow:hidden}
.dc-net img{width:100%;height:100%;object-fit:cover;transform:scale(1.08)}
.dc-net.round{border-radius:50%}

/* скрины постов */
.dc-posts{display:flex;flex-direction:column;gap:clamp(12px,1.4vw,22px)}
.dc-post{border-radius:var(--r-md);overflow:hidden;background:#fff;box-shadow:0 18px 44px rgba(30,70,90,.18)}
.dc-post img{width:104%;max-width:none;margin:-2%;height:auto}
.dc-post.rv{transition-duration:1.1s}

@media (max-width:1180px){
  .dc-grid{grid-template-columns:1fr}
  .dc-posts{flex-direction:row;align-items:flex-start;max-width:720px}
  .dc-post{flex:1}
}
@media (max-width:820px){
  .dc-body{grid-template-columns:1fr}
  .dc-meta{padding-right:8px}
}
@media (max-width:480px){
  .dc-stats{grid-template-columns:1fr}
  .dc-stat.inline{flex-wrap:wrap}
}

/* 25 — Дерматология (OTC), бирюзовый фон */
.s25 .dc-title{color:#fff}
.s25{--dc-panel:rgba(255,255,255,.18);--dc-res:linear-gradient(160deg,rgba(214,234,238,.92) 0%,rgba(226,236,239,.85) 55%,rgba(244,198,198,.9) 100%)}

/* 26-derma-rx-seeding.css */
/* 26 — Дерматология (RX) Seeding. Общий макет — в 25-derma-cases.css (.dc) */
.s26 .dc-stat.wide:not(.inline){padding-left:clamp(14px,6vw,96px)}
.s26 .dc-stat.inline .num-l{min-width:2.2ch}

/* 27-derma-rx-bloggers.css */
/* 27 — Дерматология (RX) Bloggers. Общий макет — в 25-derma-cases.css (.dc) */
.s27 .dc-panel:first-child .list{max-width:36ch}

/* 29-bars3d.css */
/* =====================================================================
   Общий объёмный график на CSS 3D (.b3d-*) — слайды 23, 30, 31; сцена и качание — и на 29.
   Столбик = параллелепипед: передняя грань (.b3d-f), правая боковая (.b3d-s, темнее), верхняя (.b3d-t).
   Плоскость графика наклонена и медленно покачивается; столбики растут при .rv.in, верхушки «дышат».

   <div class="b3d-chart sNN-chart3d" data-live role="img" aria-label="…">   (корень; .rv — он сам или предок)
     <div class="b3d-scene"><div class="b3d-stage">
       <div class="b3d-wall"><span class="b3d-title">Рекрутинг</span></div>
       <div class="b3d-floor"></div>
       <div class="b3d-cols">
         <div class="b3d-col [b3d-max]" style="--i:0;--v:.62">          (--v — высота 0..1)
           <i class="b3d-sh"></i>
           <div class="b3d-grow">
             <div class="b3d-pr [b3d-coral|b3d-mist|b3d-blush]" [style="--b:.59;--v:.41"]>   (--b — низ сегмента)
               <i class="b3d-f"></i><i class="b3d-s"></i><i class="b3d-t"></i></div></div>
           <b class="b3d-val">372</b><span class="b3d-m">июнь</span>
         </div>
       </div>
     </div></div>
   </div>

   Настройка — CSS-переменными на корне (значения по умолчанию — во втором аргументе var()):
   --b3d-w ширина сцены, --b3d-h высота стены, --b3d-d глубина столбика, --b3d-fd глубина пола,
   --b3d-gap, --b3d-px отступы колонок, --b3d-pt/--b3d-pb поля сцены (--b3d-pbn — нижнее поле на узком графике), --b3d-wall/--b3d-grid/--b3d-vgrid/--b3d-floor,
   --b3d-fv шрифт значений, --b3d-fm шрифт месяцев, --b3d-fi шрифт цифр на гранях, --b3d-vc цвет значений.
   ===================================================================== */
.b3d-chart{container-type:inline-size;position:relative}
.b3d-scene{position:relative;perspective:var(--b3d-persp,240cqw);perspective-origin:50% 45%;
  font-size:var(--b3d-fm,clamp(8px,2.2cqw,14px));
  padding:var(--b3d-pt,4cqw) 0 var(--b3d-pb,calc(var(--b3d-fd,8cqw) * .45 + 2.8em))}
.b3d-stage{position:relative;margin:0 auto;width:var(--b3d-w,90cqw);height:var(--b3d-h,42cqw);
  transform-style:preserve-3d;transform:rotateX(-18deg) rotateY(-17deg);animation:b3dSway 16s ease-in-out infinite}
.b3d-stage *{transform-style:preserve-3d}

/* стена-сетка (матовое стекло) */
.b3d-wall{position:absolute;inset:0;border-radius:.5cqw;
  background:
    linear-gradient(var(--b3d-grid,rgba(255,255,255,.95)) 1px,transparent 1px) 0 0/100% var(--b3d-rows,16.666%),
    linear-gradient(90deg,var(--b3d-vgrid,rgba(255,255,255,.95)) 1px,transparent 1px) 0 0/var(--b3d-colw,9.09%) 100%,
    var(--b3d-wall,linear-gradient(180deg,rgba(255,255,255,.42),rgba(255,255,255,.12)));
  box-shadow:inset 0 0 0 1px var(--b3d-grid,rgba(255,255,255,.95))}
.b3d-title{position:absolute;left:50%;top:5%;translate:-50% 0;transform:translateZ(.3cqw);background:#fff;border-radius:.4em;
  padding:.12em .55em;font:500 clamp(12px,2.7cqw,20px)/1.2 var(--font-head);letter-spacing:-.01em;white-space:nowrap;color:var(--ink);
  box-shadow:0 .4cqw 1.4cqw rgba(30,80,100,.12)}

/* пол: плита перед стеной, с торцом */
.b3d-floor{position:absolute;left:0;right:0;top:100%;height:var(--b3d-fd,8cqw);transform-origin:50% 0;transform:rotateX(90deg);
  border-radius:0 0 .6cqw .6cqw;background:var(--b3d-floor,linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,.35)));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.9)}
.b3d-floor::after{content:"";position:absolute;left:0;right:0;top:100%;height:var(--b3d-slab,1cqw);transform-origin:50% 0;transform:rotateX(-90deg);
  border-radius:0 0 .5cqw .5cqw;background:var(--b3d-edge,linear-gradient(180deg,rgba(150,190,202,.75),rgba(150,190,202,.35)))}

/* колонки */
.b3d-cols{position:absolute;inset:0 var(--b3d-px,4%);display:flex;gap:var(--b3d-gap,2.4cqw)}
.b3d-col{position:relative;flex:1;min-width:0}
.b3d-grow{position:absolute;inset:0;transform-origin:50% 100%;transform:scaleY(.015);
  transition:transform 1.25s cubic-bezier(.2,.75,.25,1) calc(.35s + var(--i,0) * .12s);
  animation:b3dBreath 6s ease-in-out calc(var(--i,0) * -.7s) infinite}
.rv.in .b3d-grow{transform:none}

/* параллелепипед и его грани */
.b3d-pr{position:absolute;left:0;right:0;bottom:calc(var(--b,0) * 100%);height:calc(var(--v) * 100%);
  --cf:linear-gradient(180deg,#5fabba 0%,#86bfcb 55%,#b5d6de 100%);
  --cs:linear-gradient(180deg,#3f8a98 0%,#609fad 55%,#8db7c2 100%);
  --ct:linear-gradient(180deg,#bfe5ec,#8ccbd7)}
.b3d-f,.b3d-s,.b3d-t{position:absolute;display:block;backface-visibility:hidden}
.b3d-f{inset:0;transform:translateZ(var(--b3d-d,3.6cqw));background:var(--cf);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 1px 0 0 rgba(255,255,255,.28)}
.b3d-s{left:100%;top:0;width:var(--b3d-d,3.6cqw);height:100%;transform-origin:0 50%;
  transform:translateZ(var(--b3d-d,3.6cqw)) rotateY(90deg);background:var(--cs)}
.b3d-t{left:0;bottom:100%;width:100%;height:var(--b3d-d,3.6cqw);transform-origin:50% 100%;
  transform:translateZ(var(--b3d-d,3.6cqw)) rotateX(90deg);background:var(--ct);box-shadow:inset 0 0 0 1px rgba(255,255,255,.35)}
.b3d-pr:not(:last-child) .b3d-t{display:none}

/* материалы */
.b3d-pr.b3d-coral,.b3d-max .b3d-pr{
  --cf:linear-gradient(180deg,#ff9086 0%,#f7766c 45%,#f4aba5 100%);
  --cs:linear-gradient(180deg,#d2534a 0%,#cf665d 45%,#cc8f8a 100%);
  --ct:linear-gradient(180deg,#ffcbc5,#ff9a90)}
.b3d-pr.b3d-mist{
  --cf:linear-gradient(180deg,#e3eff2,#f5e8eb);
  --cs:linear-gradient(180deg,#c6dadf,#dccdd1);
  --ct:linear-gradient(180deg,#ffffff,#eef6f8)}
.b3d-pr.b3d-blush{
  --cf:linear-gradient(180deg,#f7837a 0%,#f6b7b4 35%,#d8eaef 62%,#d8eaef 100%);
  --cs:linear-gradient(180deg,#d4645b 0%,#d49b98 35%,#b6ced5 62%,#b6ced5 100%);
  --ct:linear-gradient(180deg,#ffc4be,#fb9a92)}

/* тень столбика на полу */
.b3d-sh{position:absolute;left:-8%;right:-34%;top:100%;height:calc(var(--b3d-d,3.6cqw) * 1.9);display:block;
  transform-origin:50% 0;transform:translateY(-.2cqw) rotateX(90deg);
  background:radial-gradient(closest-side,rgba(30,80,100,.26),rgba(30,80,100,0));
  opacity:0;transition:opacity 1s ease calc(.6s + var(--i,0) * .12s)}
.b3d-max .b3d-sh{background:radial-gradient(closest-side,rgba(247,118,108,.4),rgba(247,118,108,0))}
.rv.in .b3d-sh{opacity:1}

/* подписи: всегда смотрят в камеру (обратный поворот синхронно с качанием сцены) */
.b3d-val,.b3d-m{position:absolute;white-space:nowrap;text-align:center;transform-origin:50% 100%;
  transform:translateZ(var(--fz,0)) rotateY(17deg) rotateX(18deg) rotateZ(var(--rz,0deg));animation:b3dFace 16s ease-in-out infinite}
.b3d-val{--fz:calc(var(--b3d-d,3.6cqw) * .5);left:-50%;right:-50%;bottom:calc(var(--v) * 100% + .45em);
  font:500 var(--b3d-fv,clamp(9px,2.5cqw,16px))/1 var(--font-head);letter-spacing:-.02em;color:var(--b3d-vc,#3f8f9c);
  opacity:0;transition:opacity .7s ease calc(1.1s + var(--i,0) * .12s);
  animation:b3dFace 16s ease-in-out infinite,b3dValBreath 6s ease-in-out calc(var(--i,0) * -.7s) infinite}
.b3d-max .b3d-val{color:var(--coral);font-weight:700;font-size:calc(var(--b3d-fv,clamp(9px,2.5cqw,16px)) * 1.18)}
.rv.in .b3d-val{opacity:1}
.b3d-m{--fz:var(--b3d-fd,8cqw);left:-50%;right:-50%;top:100%;padding-top:calc(var(--b3d-slab,1cqw) + .5em);transform-origin:50% 0;
  line-height:1.1;letter-spacing:-.02em;color:#3d4d54}
.b3d-max .b3d-m{color:var(--ink);font-weight:600}

/* цифры на передней грани (сегменты) */
.b3d-f em{position:absolute;left:0;right:0;top:.3em;text-align:center;font-style:normal;
  font:600 var(--b3d-fi,clamp(7px,2.3cqw,12px))/1 var(--font-head);color:#fff;
  opacity:0;transition:opacity .6s ease calc(1.2s + var(--i,0) * .12s)}
.b3d-mist .b3d-f em{color:#7fa8b4;font-weight:500}
.rv.in .b3d-f em{opacity:1}

@keyframes b3dSway{0%,100%{transform:rotateX(-18deg) rotateY(-17deg)}50%{transform:rotateX(-22deg) rotateY(-11deg)}}
@keyframes b3dFace{
  0%,100%{transform:translateZ(var(--fz,0)) rotateY(17deg) rotateX(18deg) rotateZ(var(--rz,0deg))}
  50%{transform:translateZ(var(--fz,0)) rotateY(11deg) rotateX(22deg) rotateZ(var(--rz,0deg))}}
@keyframes b3dBreath{0%,100%{scale:1 1}50%{scale:1 1.03}}
@keyframes b3dValBreath{0%,100%{translate:0 0}50%{translate:0 calc(var(--v) * var(--b3d-h,42cqw) * -.03)}}

/* узкий график: подписи месяцев наискосок */
@container (max-width:380px){
  .b3d-scene{padding-bottom:var(--b3d-pbn,calc(var(--b3d-fd,8cqw) * .45 + 4.6em))}
  .b3d-m{--rz:-48deg;left:auto;right:50%;text-align:right;transform-origin:100% 0;padding-top:calc(var(--b3d-slab,1cqw) + .35em)}
}

@media (prefers-reduced-motion:reduce){
  .b3d-stage,.b3d-grow,.b3d-val,.b3d-m{animation:none !important}
  .b3d-grow,.rv .b3d-grow{transform:none !important;transition:none !important}
  .b3d-val,.b3d-sh,.b3d-f em{opacity:1 !important;transition:none !important}
}

/* 29-hcp-cases.css */
/* Общий макет кейсов HCP (слайды 29, 30, 31): .hc + модификатор секции (.s29/.s30/.s31) */
.hc{justify-content:center}
.hc-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:clamp(18px,2.5vw,40px);margin-top:clamp(36px,4vw,56px)}
.hc-head .h1{font-size:clamp(26px,3.3vw,62px);flex:1 1 420px;min-width:0;overflow-wrap:normal;hyphens:manual}
.hc-meta{background:var(--teal-soft);border-radius:var(--r-md);padding:clamp(14px,1.4vw,22px) clamp(16px,2vw,32px);display:flex;flex-wrap:wrap;gap:clamp(14px,2.2vw,40px);align-items:center}
.hc-meta .meta{font-family:var(--font-head);font-weight:500;font-size:clamp(14px,1.2vw,20px);letter-spacing:-.01em;line-height:1.2}
.hc-meta .ico{width:clamp(44px,4vw,66px);box-shadow:none}

.hc-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr) minmax(0,1.05fr);gap:clamp(18px,2.4vw,40px) clamp(16px,2vw,32px);margin-top:clamp(26px,3vw,50px)}
.hc-tasks{grid-column:1}
.hc-sol{grid-column:2/4}
.hc-block > .tag{margin-bottom:clamp(10px,1.1vw,18px)}
.hc .tag.light{font-size:clamp(17px,1.7vw,30px);border-radius:12px}
.hc-sol .list{grid-template-columns:repeat(2,minmax(0,max-content));column-gap:clamp(24px,4vw,80px);grid-auto-flow:column;grid-template-rows:repeat(var(--rows,3),auto)}

/* на старте */
.hc-start{grid-column:1;align-self:end;display:flex;flex-direction:column;gap:clamp(10px,1vw,14px)}
.hc-start > .tag{align-self:flex-start;margin-bottom:clamp(4px,.6vw,10px)}
.hc-start-row{display:flex;align-items:center;gap:clamp(12px,1.2vw,20px);border:1.5px solid var(--ink);border-radius:var(--r-sm);padding:6px;max-width:420px}
.hc-start-row .chip{min-width:4.6em;justify-content:center;border-radius:10px;font-size:clamp(20px,2vw,34px)}
.hc-start-row .h4{font-weight:500}

/* график */
.hc-chart{grid-column:2;background:linear-gradient(160deg,#c3dae2 0%,#d6e8ee 55%,#e2eef2 100%);border-radius:var(--r);padding:clamp(16px,2.2vw,36px) clamp(14px,2vw,34px) clamp(14px,1.6vw,26px);box-shadow:0 20px 50px rgba(40,90,110,.15);min-width:0}
/* объёмные графики внутри панели: столбики — 29-bars3d.css (.b3d-*), линия — 29-hcp-chondro.css */
.hc-chart.b3d-chart{--b3d-w:90cqw;--b3d-h:40cqw;--b3d-pt:3cqw}
.hc-axis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:.6em;font-size:clamp(10px,.75vw,12px);font-weight:600;line-height:1.2}

/* результаты */
.hc-res{grid-column:3;display:flex;flex-direction:column;gap:clamp(10px,1vw,16px);align-self:end}
.hc-res > .tag{align-self:flex-end;font-size:clamp(18px,1.8vw,32px);padding:.2em 1em}
.hc-plate{background:var(--coral);color:#fff;border-radius:var(--r-md);padding:clamp(14px,1.3vw,22px) clamp(16px,1.8vw,30px);display:flex;align-items:center;justify-content:center;gap:clamp(10px,1vw,18px);box-shadow:0 12px 30px rgba(247,118,108,.25)}
.hc-plate .num-l{white-space:nowrap;font-weight:600}
.hc-plate .num-l small{font-size:.55em}
.hc-plate-txt{font-family:var(--font-head);font-weight:500;font-size:clamp(13px,1.15vw,20px);line-height:1.15;letter-spacing:-.01em}

@media (max-width:1180px){
  .hc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hc-tasks{grid-column:1}
  .hc-sol{grid-column:2}
  .hc-sol .list{grid-template-columns:1fr;grid-auto-flow:row;grid-template-rows:none}
  .hc-start{grid-column:1;align-self:start}
  .hc-res{grid-column:2;align-self:start}
  .hc-chart{grid-column:1/-1;grid-row:3}
  .hc-res > .tag{align-self:flex-start}
}
@media (max-width:820px){
  .hc-grid{grid-template-columns:1fr}
  .hc-tasks,.hc-sol,.hc-start,.hc-res,.hc-chart{grid-column:1;grid-row:auto}
  .hc-plate{justify-content:flex-start}
}
@media (max-width:520px){
  .hc-axis{font-size:9px}
}

/* 29-hcp-chondro.css */
/* 29 — Инъекционный хондропротектор (RX): объёмный линейный график.
   Сцена/стена/качание — общие из 29-bars3d.css (.b3d-scene/.b3d-stage/.b3d-wall/.b3d-floor).
   Линия = отрезки-«ленты» (.s29-seg) из 4 слоёв на разной высоте над стеной + размытая тень;
   --x/--y — начало (доли ширины/высоты стены), --l — длина в % ширины, --a — угол (стена 2:1),
   --t0/--du — когда и сколько рисуется отрезок. Точки — шарики, всегда повёрнутые к камере. */
.hc-chart.s29-chart3d{--b3d-h:45cqw;--b3d-fd:4.5cqw;--b3d-slab:.8cqw;--b3d-pt:3cqw;--b3d-pb:4cqw;--b3d-pbn:4cqw;
  --s29-t:max(3px,1.5cqw);--s29-b:max(10px,3.6cqw)}
.s29-chart3d .hc-axis{margin-top:.2em}

.s29-coral{--c0:#ffc9c2;--c1:#f7766c;--c2:#d9564d;--c3:#b4423a;--g:rgba(247,118,108,.45);color:var(--coral)}
.s29-teal{--c0:#c9eef3;--c1:#56a7b6;--c2:#3f8f9c;--c3:#2b6474;--g:rgba(86,167,182,.45);color:#3f8f9c}

/* ленты */
.s29-lines{position:absolute;inset:0}
.s29-seg{position:absolute;left:calc(var(--x) * 100%);top:calc(var(--y) * 100%);width:calc(var(--l) * 1%);height:0;
  transform-origin:0 0;transform:rotateZ(var(--a))}
.s29-seg i{position:absolute;display:block;left:calc(var(--s29-t) / -2);right:calc(var(--s29-t) / -2);top:calc(var(--s29-t) / -2);
  height:var(--s29-t);border-radius:var(--s29-t);
  clip-path:inset(-1cqw 100% -1cqw -1cqw);transition:clip-path var(--du) linear var(--t0)}
.s29-seg i:nth-child(1){transform:translateZ(.15cqw);background:rgba(30,70,90,.24);filter:blur(.45cqw)}
.s29-seg i:nth-child(2){transform:translateZ(.6cqw);background:var(--c3)}
.s29-seg i:nth-child(3){transform:translateZ(1.05cqw);background:var(--c2)}
.s29-seg i:nth-child(4){transform:translateZ(1.5cqw);background:var(--c2)}
.s29-seg i:nth-child(5){transform:translateZ(1.95cqw);background:linear-gradient(180deg,var(--c0) 0%,var(--c1) 42%,var(--c2) 100%)}
.rv.in .s29-seg i{clip-path:inset(-1cqw -1cqw -1cqw -1cqw)}

/* шарики */
.s29-dot{position:absolute;left:calc(var(--x) * 100%);top:calc(var(--y) * 100%);width:0;height:0}
.s29-dot::before{content:"";position:absolute;left:calc(var(--s29-b) * -.45);top:calc(var(--s29-b) * -.3);width:var(--s29-b);height:var(--s29-b);
  border-radius:50%;background:radial-gradient(closest-side,rgba(30,70,90,.32),rgba(30,70,90,0));transform:translateZ(.2cqw);
  opacity:0;transition:opacity .4s ease var(--t0)}
.s29-ball{--fz:2.7cqw;position:absolute;display:block;left:calc(var(--s29-b) / -2);top:calc(var(--s29-b) / -2);width:var(--s29-b);height:var(--s29-b);
  border-radius:50%;background:radial-gradient(circle at 34% 30%,#fff 0%,var(--c0) 16%,var(--c1) 46%,var(--c2) 78%,var(--c3) 100%);
  transform:translateZ(var(--fz)) rotateY(17deg) rotateX(18deg);
  opacity:0;transition:opacity .35s ease var(--t0);
  animation:b3dFace 16s ease-in-out infinite,s29Pulse 3.4s ease-in-out calc(var(--t0) + 1.6s) infinite}
.rv.in .s29-ball,.rv.in .s29-dot::before{opacity:1}

/* подписи (HTML, тоже повёрнуты к камере) */
.s29-pct,.s29-tag{position:absolute;left:calc(var(--x) * 100%);top:calc(var(--y) * 100%);translate:-50% -50%;white-space:nowrap;
  font-family:var(--font-head);font-weight:500;letter-spacing:-.02em;line-height:1.1;
  --fz:2.8cqw;transform:translateZ(var(--fz)) rotateY(17deg) rotateX(18deg);animation:b3dFace 16s ease-in-out infinite}
.s29-pct{font-size:clamp(10px,2.6cqw,17px);font-weight:600;opacity:0;transition:opacity .5s ease calc(var(--t0) + .2s)}
.rv.in .s29-pct{opacity:1}
.s29-tag{--fz:1.2cqw;font-size:clamp(11px,3cqw,22px);background:#fff;border-radius:.35em;padding:.06em .45em;
  box-shadow:0 .5cqw 1.6cqw rgba(30,80,100,.14)}

/* стрелки от подписей к линиям */
.s29-arr{position:absolute;left:calc(var(--x) * 100%);top:calc(var(--y1) * 100%);height:calc((var(--y2) - var(--y1)) * 100%);
  width:max(1.5px,.25cqw);background:currentColor;transform:translateZ(.6cqw);opacity:0;transition:opacity .6s ease 1.9s}
.s29-arr::after{content:"";position:absolute;left:50%;bottom:0;width:1.3cqw;height:1.3cqw;min-width:5px;min-height:5px;border:solid currentColor;
  border-width:0 max(1.5px,.25cqw) max(1.5px,.25cqw) 0;transform:translate(-50%,0) rotate(45deg)}
.rv.in .s29-arr{opacity:1}

@keyframes s29Pulse{
  0%{scale:1;box-shadow:0 0 0 0 var(--g)}
  50%{scale:1.14;box-shadow:0 0 0 1.1cqw rgba(255,255,255,0)}
  100%{scale:1;box-shadow:0 0 0 0 rgba(255,255,255,0)}}

@media (prefers-reduced-motion:reduce){
  .s29-seg i{clip-path:none !important;transition:none !important}
  .s29-ball,.s29-pct,.s29-tag{animation:none !important}
  .s29-ball,.s29-pct,.s29-arr,.s29-dot::before{opacity:1 !important;transition:none !important}
}

/* 30-hcp-gout.css */
/* 30 — Противоподагрическое средство (RX). Общий макет — в 29-hcp-cases.css (.hc), объёмные столбики — 29-bars3d.css (.b3d-*) */
.s30-chart3d{--b3d-gap:5.5cqw;--b3d-px:6%;--b3d-d:5cqw;--b3d-fd:9cqw}

/* 31-hcp-zolmitriptan.css */
/* 31 — Золмитриптан (RX). Общий макет — в 29-hcp-cases.css (.hc), объёмные столбики — 29-bars3d.css (.b3d-*) */
.s31-chart3d{--b3d-gap:2.3cqw;--b3d-px:3%;--b3d-d:3.4cqw;--b3d-fd:7.5cqw;--b3d-fm:clamp(8px,2cqw,13px);--b3d-fv:clamp(8px,2.3cqw,15px)}

/* 33-special.css */
.sp{gap:0}
.sp .corner-tag{font-family:var(--font-head);font-weight:500}
.sp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,5vw,90px);align-items:end}
.sp-item{position:relative;display:flex;flex-direction:column;align-items:center}
.sp-head{width:88%;display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:clamp(60px,8vw,120px);margin-bottom:calc(-1 * clamp(52px,7vw,104px));border-radius:var(--r-md)}
.sp-head .small{margin-top:4px}
.sp-link{font-size:clamp(12px,1vw,16px);text-decoration:underline;text-underline-offset:3px}
.laptop{position:relative;width:100%;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.laptop .screen{margin:0 7%;background:#111;border-radius:14px 14px 0 0;padding:1.6% 1.6% 0;box-shadow:0 20px 50px rgba(20,50,70,.25)}
.laptop .screen img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-radius:4px 4px 0 0;background:#222}
.laptop .base{height:clamp(10px,1.2vw,18px);background:linear-gradient(#e9edf0,#b9c2c8);border-radius:2px 2px 14px 14px;position:relative;box-shadow:0 14px 26px rgba(20,50,70,.22)}
.laptop .base::before{content:"";position:absolute;left:42%;right:42%;top:0;height:35%;background:#c9d1d6;border-radius:0 0 8px 8px}
.sp-item:hover .laptop{transform:translateY(-8px)}
@media (max-width:820px){ .sp-grid{grid-template-columns:1fr} .sp-head{width:94%} }

/* 35-contact.css */
.contact{min-height:100vh;justify-content:flex-end;padding-bottom:clamp(40px,8vh,90px)}
.contact-brand{display:flex;gap:12px;align-items:center}
.contact-brand .logo{height:clamp(46px,4vw,62px);font-size:clamp(24px,2.4vw,36px)}
.contact-pill{border:none;white-space:normal;font-family:var(--font-head);font-weight:500;font-size:clamp(14px,1.4vw,22px);padding:.55em 1em;border-radius:14px}
.contact-lead{font-family:var(--font-head);font-weight:500;font-size:clamp(26px,3.4vw,58px);letter-spacing:-.035em;margin-top:clamp(30px,6vh,70px)}
.contact-mega{font-size:clamp(52px,14vw,260px);line-height:.9;margin-top:.05em}
.contact-links{display:flex;flex-wrap:wrap;gap:clamp(12px,2.4vw,40px);margin-top:clamp(30px,6vh,70px);font-family:var(--font-head);font-weight:500;font-size:clamp(16px,1.6vw,26px)}
.contact-links a{text-underline-offset:5px}
.contact-links a + a{padding-left:clamp(12px,2.4vw,40px);border-left:1.5px solid rgba(11,11,12,.4)}
.qr{position:absolute;right:clamp(20px,4vw,60px);top:clamp(90px,12vh,120px);background:#fff;border-radius:var(--r-md);padding:14px 14px 10px;display:flex;flex-direction:column;align-items:center;gap:6px;text-decoration:none;font-family:var(--font-head);font-weight:700;font-size:13px;box-shadow:0 10px 40px rgba(20,60,80,.12)}
.qr img{width:clamp(110px,10vw,160px)}
@media (max-width:640px){ .qr{display:none} .contact-links a + a{border:none;padding-left:0} }