/* ============================================================
   Cases — самостоятельный сайт кейсов cases.<домен> (layouts/cases).
   Визуальный язык «командного центра» (скилл futurist-designer, Dark Ops):
   графитовая основа, один сигнальный акцент, крупные светлые цифры,
   крошечные подписи, волосяные линии вместо рамок, герой-кадр под стеклом.
   Единственный файл стилей поддомена; всё под .cs (класс body).
   ============================================================ */

.cs{
  --bg:#0d0d0d;
  --s1:#141414;
  --s2:#1b1b1b;
  --s3:#262626;
  --line:rgba(255,255,255,.08);
  --line-dash:rgba(255,255,255,.14);
  --fg:#f4f4f4;
  --dim:#8d8d8d;
  --mute:#7a7a7a;
  --accent:#0cb4ce;
  --maxw:1400px;
  --pad:clamp(16px,4vw,56px);
  --r-card:18px;
  --r-float:22px;
  --ease:cubic-bezier(.16,1,.3,1);
  --font-display:"Inter Tight","Helvetica Neue",Helvetica,Arial,sans-serif;
  --font-ui:"Golos Text",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;

  margin:0;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  font-family:var(--font-ui);
  font-size:15px;
  line-height:1.55;
  color:var(--fg);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
}
.cs main{flex:1 0 auto;}
.cs *{box-sizing:border-box;}
.cs img{display:block;max-width:100%;}
.cs a{color:inherit;text-decoration:none;}
.cs h1,.cs h2,.cs h3{margin:0;font-family:var(--font-display);font-weight:400;letter-spacing:-.02em;line-height:1.05;}
.cs p{margin:0;}
.cs ul{margin:0;padding:0;list-style:none;}
.cs :focus-visible{outline:2px solid var(--accent);outline-offset:3px;}
.cs .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.cs .container{max-width:var(--maxw);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad);}
.cs .tabular{font-variant-numeric:tabular-nums;}

/* ============ TYPE RECIPES ============ */
/* Индекс раздела: квадратик, «002 / Направления» */
.cs .index{display:inline-flex;align-items:center;gap:10px;font-size:11px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);}
.cs .index::before{content:"";width:4px;height:4px;background:var(--accent);}
.cs .index b{color:var(--fg);font-weight:500;}
/* Двухтоновый заголовок: контекст приглушён, утверждение ярко, в конце — каретка */
.cs .two-tone{font-family:var(--font-display);font-weight:300;letter-spacing:-.03em;line-height:1.02;color:var(--dim);}
.cs .two-tone strong{font-weight:400;color:var(--fg);}
/* Каретка — строчный, а не inline-block элемент: так браузер не переносит её одну на новую строку */
.cs .caret{display:inline;padding-left:2px;margin-left:.18em;font-size:.72em;background:var(--accent);animation:cs-blink 1.06s steps(1) infinite;}
@keyframes cs-blink{50%{opacity:0;}}
/* Цифры — главная типографика */
.cs .num{font-family:var(--font-display);font-weight:300;letter-spacing:-.03em;line-height:1;font-variant-numeric:tabular-nums;}
.cs .num small{font-size:.38em;letter-spacing:0;color:var(--dim);margin-left:.18em;vertical-align:.95em;font-weight:400;}
.cs .label{font-size:12px;line-height:1.3;color:var(--mute);}
.cs .lead{font-size:clamp(15px,1.3vw,17px);color:var(--dim);max-width:52ch;}

/* ============ BUTTONS / CHIPS ============ */
.cs .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:44px;padding:0 22px;border-radius:999px;font:500 14px/1 var(--font-ui);border:1px solid transparent;cursor:pointer;transition:background .2s,border-color .2s,color .2s;}
.cs .btn--accent{background:var(--accent);color:#141414;}
.cs .btn--accent:hover{background:#20c8e2;}
.cs .btn--ghost{border-color:var(--line-dash);color:var(--fg);background:rgba(255,255,255,.02);}
.cs .btn--ghost:hover{border-color:rgba(255,255,255,.4);}
.cs .btn .arrow{font-family:var(--font-display);font-size:16px;line-height:1;}
.cs .tag{display:inline-flex;align-items:center;height:24px;white-space:nowrap;padding:0 10px;border-radius:999px;font-size:12px;color:var(--dim);border:1px solid var(--line);}
.cs a.tag:hover{color:var(--fg);border-color:var(--line-dash);}

/* ============ GLASS ============ */
.cs .glass{
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.04));
  background-color:rgba(20,20,20,.35);
  backdrop-filter:blur(28px) saturate(140%);
  -webkit-backdrop-filter:blur(28px) saturate(140%);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 20px 40px -20px rgba(0,0,0,.6);
  border-radius:var(--r-float);
}
@supports not (backdrop-filter:blur(1px)){.cs .glass{background:rgba(27,27,27,.92);}}

/* ============ HEADER ============ */
.cs .cs-header{position:fixed;top:0;left:0;right:0;z-index:60;transition:background .3s,border-color .3s;border-bottom:1px solid transparent;}
.cs .cs-header.is-solid{background:rgba(13,13,13,.86);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom-color:var(--line);}
.cs .cs-header__inner{display:flex;align-items:center;gap:32px;height:68px;}
.cs .cs-logo{display:inline-flex;align-items:center;gap:12px;flex:0 0 auto;}
.cs .cs-logo img{height:22px;width:auto;}
.cs .cs-logo span{font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);padding-left:12px;border-left:1px solid var(--line-dash);}
.cs .cs-nav{display:flex;align-items:center;gap:24px;flex:1;justify-content:space-between;}
.cs .cs-nav__list{display:flex;align-items:center;gap:26px;font-size:13px;}
.cs .cs-nav__list > li > a,.cs .cs-nav__drop summary{color:var(--dim);transition:color .2s;}
.cs .cs-nav__list > li > a:hover,.cs .cs-nav__list a[aria-current="page"],.cs .cs-nav__drop summary:hover{color:var(--fg);}
.cs .cs-nav__drop{position:relative;}
.cs .cs-nav__drop summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;}
.cs .cs-nav__drop summary::-webkit-details-marker{display:none;}
.cs .cs-nav__drop summary::after{content:"";width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg) translateY(-3px);}
.cs .cs-nav__drop details[open] summary{color:var(--fg);}
.cs .cs-nav__drop ul{position:absolute;top:calc(100% + 18px);left:-14px;min-width:300px;padding:8px;display:flex;flex-direction:column;}
.cs .cs-nav__drop ul a{display:flex;justify-content:space-between;gap:16px;padding:10px 12px;border-radius:12px;font-size:14px;color:var(--fg);}
.cs .cs-nav__drop ul a:hover,.cs .cs-nav__drop ul a[aria-current="page"]{background:rgba(255,255,255,.06);}
.cs .cs-nav__drop ul a span{font-size:11px;color:var(--mute);font-variant-numeric:tabular-nums;}
.cs .cs-nav__contacts{display:flex;align-items:center;gap:20px;}
.cs .cs-phone{font-size:13px;color:var(--dim);white-space:nowrap;font-variant-numeric:tabular-nums;}
.cs .cs-phone:hover{color:var(--fg);}
.cs .cs-header .btn{height:38px;padding:0 18px;font-size:13px;}
.cs .cs-burger{display:none;margin-left:auto;width:44px;height:44px;border:1px solid var(--line-dash);border-radius:999px;background:transparent;cursor:pointer;position:relative;}
.cs .cs-burger i,.cs .cs-burger i::before,.cs .cs-burger i::after{position:absolute;left:13px;width:16px;height:1.5px;background:var(--fg);content:"";}
.cs .cs-burger i{top:21px;}
.cs .cs-burger i::before{left:0;top:-5px;}
.cs .cs-burger i::after{left:0;top:5px;}
@media(max-width:900px){
  .cs .cs-burger{display:block;}
  .cs .cs-nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:24px;padding:20px var(--pad) 28px;background:var(--bg);border-bottom:1px solid var(--line);}
  .cs .cs-header.is-open{background:var(--bg);}
  .cs .cs-header.is-open .cs-nav{display:flex;}
  .cs .cs-nav__list{flex-direction:column;align-items:flex-start;gap:16px;font-size:18px;}
  .cs .cs-nav__drop ul{position:static;min-width:0;padding:8px 0 0;background:none;border:0;box-shadow:none;backdrop-filter:none;}
  .cs .cs-nav__contacts{flex-wrap:wrap;}
}

/* ============ HERO ============ */
.cs .hero{position:relative;min-height:max(640px,100svh);display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;isolation:isolate;}
.cs .hero--page{min-height:max(520px,72svh);}
/* Контейнер во flex-колонке с margin:auto не растягивается — задаём ширину явно */
.cs .hero > .container{width:100%;}
.cs .hero__media{position:absolute;inset:0;z-index:-2;}
.cs .hero__media img,.cs .hero__media picture{width:100%;height:100%;}
.cs .hero__media img{object-fit:cover;filter:saturate(.7) contrast(1.05) brightness(.5);transform:scale(1.06);animation:cs-drift 48s linear infinite alternate;}
@keyframes cs-drift{to{transform:scale(1) translate3d(-1.2%,-.8%,0);}}
.cs .hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(180deg,rgba(13,13,13,.7) 0%,rgba(13,13,13,.15) 24%,rgba(13,13,13,.45) 58%,var(--bg) 100%),
  radial-gradient(ellipse 55% 45% at 22% 72%,rgba(13,13,13,.6),transparent 72%),
  radial-gradient(ellipse 30% 40% at 88% 68%,rgba(13,13,13,.55),transparent 72%);}
/* На фото приглушённые тона светлее: контраст ≥ 4.5:1 поверх кадра */
.cs .hero:not(.hero--plain){--dim:#a9a9a9;--mute:#9a9a9a;}
.cs .hero:not(.hero--plain) .lead{color:#c4c4c4;}
.cs .hero .btn--ghost{background:rgba(13,13,13,.4);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-color:rgba(255,255,255,.28);}
.cs .hero::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.06;mix-blend-mode:overlay;pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}
.cs .hero--plain{min-height:auto;padding-top:148px;}
.cs .hero--plain::before{background:radial-gradient(ellipse 50% 60% at 85% 0%,rgba(12,180,206,.08),transparent 70%);}
.cs .hero__body{padding-top:140px;padding-bottom:40px;display:grid;gap:28px;grid-template-columns:repeat(12,1fr);align-items:end;}
.cs .hero__title{grid-column:1 / span 9;font-size:clamp(40px,6.4vw,96px);max-width:15ch;}
.cs .hero--page .hero__title{font-size:clamp(36px,5.2vw,80px);max-width:18ch;}
.cs .hero__aside{grid-column:10 / span 3;display:flex;flex-direction:column;gap:20px;}
.cs .hero__meta{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;}
.cs .index.hero__meta{flex-wrap:nowrap;gap:10px;}
.cs .hero__cta{display:flex;flex-wrap:wrap;gap:12px;}
@media(max-width:1000px){
  .cs .hero__title,.cs .hero__aside{grid-column:1 / -1;}
}

/* Полоса KPI на герое */
.cs .kpis{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-dash);}
.cs .kpi{padding:22px 24px 26px 0;display:flex;flex-direction:column;gap:12px;}
.cs .kpi + .kpi{padding-left:24px;border-left:1px solid var(--line);}
.cs .kpi .num{font-size:clamp(40px,4.6vw,64px);}
.cs .kpi .label{max-width:18ch;}
@media(max-width:760px){
  .cs .kpis{grid-template-columns:repeat(2,1fr);}
  .cs .kpi:nth-child(3){padding-left:0;border-left:0;}
  .cs .kpi:nth-child(n+3){border-top:1px solid var(--line);}
}

/* Стеклянная карточка на герое */
.cs .float-card{padding:18px 20px;display:flex;flex-direction:column;gap:10px;max-width:320px;}
.cs .float-card__top{display:flex;justify-content:space-between;align-items:center;gap:12px;}
.cs .float-card__title{font-size:15px;font-weight:500;}
.cs .float-card .arrow{font-family:var(--font-display);color:var(--dim);}
.cs a.float-card:hover .arrow{color:var(--accent);}

/* ============ SECTIONS ============ */
.cs .section{padding:clamp(72px,9vw,128px) 0;}
.cs .section--tight{padding-top:24px;}
.cs .sec-head{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;align-items:end;margin-bottom:48px;}
.cs .sec-head .index{grid-column:1 / -1;}
.cs .sec-head h2{grid-column:1 / span 7;font-size:clamp(30px,3.6vw,52px);}
.cs .sec-head p{grid-column:9 / span 4;}
@media(max-width:900px){.cs .sec-head h2,.cs .sec-head p{grid-column:1 / -1;}}

/* ============ DIRECTIONS INDEX ============ */
.cs .dir-list{border-top:1px solid var(--line);}
.cs .dir-row{position:relative;display:grid;grid-template-columns:72px minmax(0,1.3fr) minmax(0,1fr) 180px 40px;gap:24px;align-items:center;padding:28px 0;border-bottom:1px solid var(--line);transition:background .25s;}
.cs .dir-row:hover{background:linear-gradient(90deg,rgba(255,255,255,.025),transparent 70%);}
.cs .dir-row__index{font-size:11px;color:var(--mute);font-variant-numeric:tabular-nums;letter-spacing:.06em;}
.cs .dir-row__title{font-size:clamp(24px,2.4vw,36px);font-weight:300;}
.cs .dir-row__link::after{content:"";position:absolute;inset:0;}
.cs .dir-row__lead{font-size:14px;color:var(--dim);}
.cs .dir-row__subs{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;position:relative;z-index:1;}
.cs .dir-row__count{display:flex;align-items:baseline;gap:10px;justify-content:flex-end;}
.cs .dir-row__count .num{font-size:clamp(34px,3.2vw,48px);}
.cs .dir-row__arrow{font-family:var(--font-display);font-size:22px;color:var(--mute);transition:color .2s,transform .2s;}
.cs .dir-row:hover .dir-row__arrow{color:var(--accent);transform:translate(2px,-2px);}
.cs .cluster{padding:40px 0 16px;display:flex;align-items:baseline;gap:16px;}
.cs .cluster h3{font-size:14px;font-family:var(--font-ui);font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--dim);}
@media(max-width:900px){
  .cs .dir-row{grid-template-columns:48px minmax(0,1fr) auto;row-gap:12px;}
  .cs .dir-row__lead{grid-column:2 / -1;}
  .cs .dir-row__count{grid-column:3;grid-row:1;}
  .cs .dir-row__arrow{display:none;}
}

/* ============ PROJECT CARDS ============ */
.cs .project-grid{display:grid;gap:16px;grid-template-columns:repeat(3,1fr);}
.cs .project-grid--feature > :first-child{grid-column:span 2;grid-row:span 2;}
.cs .project-grid--feature > :first-child .project-card__media{aspect-ratio:auto;height:100%;min-height:420px;}
@media(max-width:1000px){.cs .project-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.cs .project-grid{grid-template-columns:1fr;}.cs .project-grid--feature > :first-child{grid-column:auto;grid-row:auto;}}
.cs .project-card{position:relative;display:flex;flex-direction:column;border-radius:var(--r-card);overflow:hidden;background:var(--s2);border:1px solid var(--line);isolation:isolate;}
.cs .project-card__media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--s1);}
.cs .project-card__media img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) brightness(.9);transition:transform .8s var(--ease),filter .4s;}
.cs .project-card:hover .project-card__media img{transform:scale(1.035);filter:saturate(1) brightness(1);}
.cs .project-card__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(13,13,13,.75));}
.cs .project-card__index{position:absolute;top:16px;left:16px;z-index:1;font-size:11px;letter-spacing:.06em;color:rgba(255,255,255,.75);font-variant-numeric:tabular-nums;}
.cs .project-card__caption{position:absolute;left:12px;right:12px;bottom:12px;z-index:1;padding:14px 16px;border-radius:14px;display:flex;justify-content:space-between;align-items:flex-end;gap:12px;}
.cs .project-card__title{font-size:18px;font-weight:400;letter-spacing:-.01em;}
.cs .project-card--feature .project-card__title{font-size:clamp(22px,2.2vw,30px);font-weight:300;}
.cs .project-card__meta{font-size:12px;color:var(--dim);margin-top:4px;}
.cs .project-card__link::after{content:"";position:absolute;inset:0;z-index:2;}
.cs .project-card__arrow{font-family:var(--font-display);font-size:18px;color:var(--dim);}
.cs .project-card:hover .project-card__arrow{color:var(--accent);}
.cs .project-card__tags{display:flex;flex-wrap:wrap;gap:6px;padding:14px 16px 16px;}

/* ============ FILTER (сегменты) ============ */
.cs .segments{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:999px;background:var(--s2);border:1px solid var(--line);}
.cs .segments a{height:36px;display:inline-flex;align-items:center;gap:8px;padding:0 16px;border-radius:999px;font-size:13px;color:var(--dim);transition:color .2s,background .2s;}
.cs .segments a:hover{color:var(--fg);}
.cs .segments a[aria-current="page"]{background:var(--fg);color:var(--bg);}
.cs .segments a span{font-size:11px;opacity:.6;font-variant-numeric:tabular-nums;}
@media(max-width:640px){.cs .segments{border-radius:20px;}}

/* ============ WORKS ============ */
.cs .works{display:grid;gap:12px;grid-template-columns:repeat(3,1fr);}
@media(max-width:1000px){.cs .works{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.cs .works{grid-template-columns:1fr;}}
.cs .work{margin:0;display:flex;flex-direction:column;gap:10px;}
.cs .work__media{position:relative;display:block;aspect-ratio:3/2;border-radius:14px;overflow:hidden;background:var(--s1);cursor:zoom-in;}
.cs .work__media img{width:100%;height:100%;object-fit:cover;filter:saturate(.9);transition:transform .8s var(--ease),filter .4s;}
.cs .work__media:hover img{transform:scale(1.03);filter:saturate(1);}
.cs .work__badge{position:absolute;left:12px;top:12px;height:26px;display:inline-flex;align-items:center;padding:0 10px;border-radius:999px;font-size:11px;letter-spacing:.04em;background:rgba(13,13,13,.55);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12);}
.cs .work__play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.08);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.2);}
.cs .work__play::before{content:"";margin-left:4px;border-style:solid;border-width:9px 0 9px 15px;border-color:transparent transparent transparent var(--fg);}
.cs .work__play::after{content:"";position:absolute;inset:-14px;border-radius:50%;border:1px dashed rgba(255,255,255,.18);}
.cs a.work__media[href^="http"]:not([data-fancybox]){cursor:alias;}
.cs .work__caption{font-size:13px;color:var(--dim);}
.cs .work-group + .work-group{margin-top:72px;}
.cs .work-group__head{display:grid;grid-template-columns:72px minmax(0,1fr) auto;gap:24px;align-items:baseline;padding-bottom:20px;margin-bottom:24px;border-bottom:1px solid var(--line);}
.cs .work-group__head h2{font-size:clamp(24px,2.6vw,36px);font-weight:300;}
.cs .work-group__head a{font-size:13px;color:var(--dim);}
.cs .work-group__head a:hover{color:var(--accent);}

/* ============ SPEC CARD (страница проекта) ============ */
.cs .spec{padding:20px 22px;display:flex;flex-direction:column;gap:0;}
.cs .spec__row{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:13px;}
.cs .spec__row:last-of-type{border-bottom:0;}
.cs .spec__row dt{color:var(--dim);}
.cs .spec__row dd{margin:0;text-align:right;}
.cs .spec__row a{color:var(--fg);border-bottom:1px solid var(--line-dash);}
.cs .spec__row a:hover{border-bottom-color:var(--accent);}
.cs .spec__counts{display:grid;grid-template-columns:repeat(3,1fr);margin-top:12px;padding-top:16px;border-top:1px solid rgba(255,255,255,.12);}
.cs .spec__counts div{display:flex;flex-direction:column;gap:6px;}
.cs .spec__counts .num{font-size:36px;}

/* ============ PROSE ============ */
.cs .text-block{display:grid;grid-template-columns:repeat(12,1fr);gap:24px;}
.cs .text-block .index{grid-column:1 / span 3;align-self:start;margin-top:8px;}
.cs .prose{grid-column:4 / span 7;color:#cfcfcf;font-size:16px;line-height:1.7;}
@media(max-width:900px){.cs .text-block .index,.cs .prose{grid-column:1 / -1;}}
.cs .prose h2{font-size:clamp(24px,2.4vw,34px);font-weight:300;color:var(--fg);margin:48px 0 18px;}
.cs .prose h3{font-size:20px;color:var(--fg);margin:32px 0 12px;}
.cs .prose > :first-child{margin-top:0;}
.cs .prose p{margin:0 0 16px;}
.cs .prose ul,.cs .prose ol{margin:0 0 18px;padding:0;list-style:none;border-left:1px solid var(--line-dash);}
.cs .prose li{padding:6px 0 6px 18px;position:relative;}
.cs .prose li::before{content:"";position:absolute;left:-2px;top:16px;width:3px;height:3px;background:var(--accent);}
.cs .prose strong{color:var(--fg);font-weight:500;}
.cs .prose a{color:var(--fg);border-bottom:1px solid var(--accent);}
.cs .prose img{border-radius:14px;margin:24px 0;}

/* ============ CRUMBS ============ */
.cs .crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12px;color:var(--mute);}
.cs .crumbs li{display:flex;align-items:center;gap:8px;}
.cs .crumbs li + li::before{content:"/";color:rgba(255,255,255,.25);}
.cs .crumbs a:hover{color:var(--fg);}
.cs .crumbs [aria-current="page"]{color:var(--dim);}

/* ============ DEVELOPERS ============ */
.cs .dev-table{border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);}
.cs .dev-table a{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:18px 20px 18px 0;border-bottom:1px solid var(--line);font-size:16px;transition:color .2s;}
.cs .dev-table a:nth-child(3n+2),.cs .dev-table a:nth-child(3n+3){padding-left:20px;border-left:1px solid var(--line);}
.cs .dev-table a:hover{color:var(--accent);}
.cs .dev-table .num{font-size:22px;color:var(--dim);}
@media(max-width:900px){.cs .dev-table{grid-template-columns:1fr;}.cs .dev-table a:nth-child(n){padding-left:0;border-left:0;}}
.cs .dev-logo{height:40px;width:auto;margin-bottom:28px;filter:grayscale(1) brightness(1.8);}

/* ============ EMPTY ============ */
.cs .empty{padding:56px 24px;border:1px dashed var(--line-dash);border-radius:var(--r-card);text-align:center;color:var(--dim);}
.cs .empty a{color:var(--fg);border-bottom:1px solid var(--accent);}

/* ============ FORM ============ */
.cs .cs-form__card{position:relative;display:grid;gap:40px;grid-template-columns:repeat(12,1fr);padding:clamp(28px,4vw,56px);border-radius:28px;background:var(--s1);border:1px solid var(--line);overflow:hidden;isolation:isolate;}
.cs .cs-form__card::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 55% 70% at 0% 100%,rgba(12,180,206,.09),transparent 70%);}
.cs .cs-form__intro{grid-column:1 / span 5;display:flex;flex-direction:column;gap:20px;}
.cs .cs-form__intro h2{font-size:clamp(32px,3.6vw,52px);}
.cs .cs-form__fields{grid-column:7 / span 6;display:grid;gap:14px;grid-template-columns:1fr 1fr;}
.cs .cs-form__wide{grid-column:1 / -1;}
@media(max-width:900px){.cs .cs-form__intro,.cs .cs-form__fields{grid-column:1 / -1;}}
@media(max-width:560px){.cs .cs-form__fields{grid-template-columns:1fr;}}
.cs .cs-form__fields label{display:flex;flex-direction:column;gap:8px;font-size:12px;color:var(--mute);}
.cs .cs-form__fields input,.cs .cs-form__fields textarea{font:inherit;font-size:15px;color:var(--fg);background:var(--bg);border:1px solid var(--line-dash);border-radius:14px;padding:14px 16px;outline:none;transition:border-color .2s;}
.cs .cs-form__fields input:focus,.cs .cs-form__fields textarea:focus{border-color:var(--accent);}
.cs .cs-form__fields textarea{resize:vertical;min-height:96px;}
.cs .cs-form__fields button{height:52px;}
.cs .cs-form__fields button:disabled{opacity:.7;cursor:default;}
.cs .cs-form__note{font-size:12px;color:var(--mute);}
.cs .cs-form__status{font-size:14px;min-height:1em;color:var(--fg);}

/* ============ FOOTER ============ */
.cs .cs-footer{border-top:1px solid var(--line);padding:64px 0 28px;margin-top:40px;}
.cs .cs-footer__grid{display:grid;gap:36px;grid-template-columns:repeat(12,1fr);}
.cs .cs-footer__grid > :first-child{grid-column:1 / span 5;}
.cs .cs-footer__grid > :nth-child(2){grid-column:7 / span 3;}
.cs .cs-footer__grid > :nth-child(3){grid-column:10 / span 3;}
@media(max-width:900px){.cs .cs-footer__grid > :nth-child(n){grid-column:1 / -1;}}
.cs .cs-footer__text{margin-top:20px;font-size:14px;color:var(--dim);max-width:40ch;}
.cs .cs-footer__title{margin-bottom:16px;}
.cs .cs-footer__list{display:flex;flex-direction:column;gap:10px;font-size:14px;color:var(--dim);}
.cs .cs-footer__list a:hover{color:var(--fg);}
.cs .cs-footer__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:56px;padding-top:20px;border-top:1px solid var(--line);font-size:12px;color:var(--mute);}
.cs .cs-footer__bottom a:hover{color:var(--fg);}

/* ============ MOTION ============ */
.cs [data-reveal]{opacity:0;transform:translateY(12px);transition:opacity .6s var(--ease),transform .6s var(--ease);}
.cs [data-reveal].is-in{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){
  .cs *,.cs *::before,.cs *::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
  .cs .caret{animation:none;opacity:1;}
  .cs .hero__media img{transform:none;}
  .cs [data-reveal]{opacity:1;transform:none;}
}

/* 12-колоночные сетки на узком экране — одна колонка: одни только промежутки
   (11 × 24–40 px) шире телефона и распирали страницу вбок. */
@media(max-width:900px){
  .cs .hero__body,.cs .sec-head,.cs .text-block,.cs .cs-form__card,.cs .cs-footer__grid{grid-template-columns:minmax(0,1fr);}
  .cs .cs-form__card{gap:28px;}
}

/* Телефон: фото героя — полосой сверху (на всю высоту героя кадр обрезался
   до куска стены и тонул в затемнении), строки и заголовки групп — в две
   строки вместо узких колонок, фильтр — лентой с прокруткой. */
@media(max-width:640px){
  .cs .hero__media{bottom:auto;height:min(78svh,640px);}
  .cs .hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,var(--bg));}
  .cs .hero::before{background:linear-gradient(180deg,rgba(13,13,13,.6) 0%,rgba(13,13,13,.05) 20%,rgba(13,13,13,.5) 50%,var(--bg) 100%);}
  .cs [data-cases-home] .hero__body{padding-top:max(140px,30svh);}
  .cs [data-cases-home] .float-card{display:none;}

  .cs .dir-row{grid-template-columns:minmax(0,1fr) auto;row-gap:14px;padding:24px 0;}
  .cs .dir-row__index{grid-column:1;grid-row:1;}
  .cs .dir-row > div{grid-column:1 / -1;grid-row:2;}
  .cs .dir-row__count{grid-column:2;grid-row:1;}
  .cs .dir-row__lead{grid-column:1 / -1;grid-row:3;}

  .cs .segments{display:flex;flex-wrap:nowrap;max-width:100%;overflow-x:auto;scrollbar-width:none;border-radius:999px;}
  .cs .segments::-webkit-scrollbar{display:none;}
  .cs .segments a{flex:0 0 auto;white-space:nowrap;}

  .cs .work-group__head{grid-template-columns:minmax(0,1fr) auto;row-gap:12px;}
  .cs .work-group__head h2{grid-column:1 / -1;grid-row:2;}
  .cs .work-group + .work-group{margin-top:56px;}

  .cs .dev-table{grid-template-columns:1fr 1fr;}
  .cs .dev-table a{font-size:15px;padding-right:12px;}
  .cs .dev-table a:nth-child(2n){padding-left:14px;border-left:1px solid var(--line);}
}