@font-face{font-family:Manrope;src:url('../assets/fonts/Manrope.ttf') format('truetype');font-weight:200 800;font-display:swap}
:root {
  --bg:#060f2b;
  --panel:#0b1c4a;
  --text:#ffffff;
  --muted:#b4c2df;
  --accent:#3d7dff;
  --line:#294273;
  --paper:#f5f7fc;
  --ink:#0b1c4a;
  --max:1320px;
  color-scheme:dark
}
* {
  box-sizing:border-box
}
html {
  scroll-behavior:smooth;
  scroll-padding-top:30px
}
body {
  margin:0;
  background:var(--bg);
  color:var(--text);
  font:16px/1.6 Manrope,Arial,sans-serif
}
a {
  color:inherit;
  text-decoration:none
}
button,input,textarea {
  font:inherit
}
button,a,input,textarea,summary {
  -webkit-tap-highlight-color:transparent
}
button {
  cursor:pointer
}
button:disabled {
  cursor:wait;
  opacity:.65
}
button {
  color:inherit
}
img {
  display:block;
  max-width:100%;
  height:auto
}
h1,h2,h3,p {
  margin:0
}
h1,h2 {
  font-family:Manrope,'Arial Narrow',sans-serif;
  font-weight:400;
  line-height:1.08;
  letter-spacing:-.025em
}
h2 {
  font-size:clamp(44px,4.4vw,66px)
}
h3 {
  font-weight:400;
  line-height:1.3
}
small {
  font-size:13px
}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,[tabindex]:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:5px
}
.light :focus-visible {
  outline-color:#1d6bff
}
.wrap {
  width:min(var(--max),calc(100% - 96px));
  margin-inline:auto
}
.skip {
  position:fixed;
  left:20px;
  top:-100px;
  padding:12px 20px;
  background:var(--accent);
  color:var(--bg);
  z-index:100
}
.skip:focus {
  top:12px
}
.header {
  height:106px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  border-bottom:1px solid var(--line)
}
.brand {
  display:block;
  width:184px;
  flex-shrink:0
}
.brand img {
  width:100%;
  filter:invert(1);
  mix-blend-mode:screen
}
.header nav {
  display:flex;
  gap:36px
}
.header nav a {
  font-size:14px;
  color:#c6c9cb
}
.header nav a:hover,.underlined:hover {
  color:var(--accent)
}
.header-cta {
  border:0;
  background:none;
  padding:14px 0;
  font-size:14px
}
.header-cta span {
  margin-left:20px;
  color:var(--accent);
  font-size:22px
}
.intro {
  color:var(--muted);
  font-size:14px;
  margin-bottom:25px
}
.button {
  border:1px solid transparent;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:15px 26px;
  min-height:54px;
  transition:background .2s,color .2s
}
.primary {
  background:var(--accent);
  color:#0b1c4a
}
.primary:hover {
  background:#1d6bff
}
.light {
  background:var(--paper);
  color:var(--ink);
  color-scheme:light
}
.start {
  padding:98px 0
}
.section-heading {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:40px;
  margin-bottom:51px
}
.section-heading>p,.section-heading>div {
  max-width:420px
}
.section-heading p {
  line-height:1.7;
  font-size:15px
}
.muted {
  color:#535b60;
  font-size:13px!important;
  margin-top:17px
}
.starter-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1px;
  background:#c7cccd;
  border:1px solid #c7cccd
}
.starter {
  min-width:0;
  border:0;
  text-align:left;
  background:var(--paper);
  color:var(--ink);
  padding:25px 22px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  transition:background .2s
}
.starter:hover {
  background:#e6edff
}
.starter>span:first-child {
  font-size:15px
}
.starter strong {
  font-family:Manrope,sans-serif;
  font-size:35px;
  font-weight:400;
  margin:20px 0 5px;
  line-height:1.2
}
.starter small {
  color:#535b60;
  line-height:1.5
}
.starter-action {
  font-size:12px;
  margin-top:24px;
  border-top:1px solid #bcc1c2;
  padding-top:12px;
  width:100%;
  display:flex;
  justify-content:space-between
}
.services {
  padding-block:105px 70px
}
.services>.section-heading p {
  color:var(--muted)
}
.service-group {
  display:grid;
  grid-template-columns:1fr 1.7fr;
  gap:85px;
  padding:46px 0 60px;
  border-top:1px solid var(--line);
  scroll-margin-top:30px
}
.group-intro h3 {
  font-family:Manrope,sans-serif;
  font-size:34px;
  line-height:1.15;
  max-width:340px
}
.group-intro p {
  color:#b8bec3;
  margin:20px 0;
  max-width:300px;
  font-size:14px
}
.group-intro small {
  display:block;
  color:var(--accent);
  max-width:290px;
  font-size:12px
}
.service {
  border-bottom:1px solid var(--line)
}
summary {
  cursor:pointer;
  list-style:none;
  position:relative;
  padding:20px 25px 20px 0;
  line-height:1.5
}
summary::-webkit-details-marker {
  display:none
}
summary:after {
  content:'+';
  position:absolute;
  right:0;
  top:19px;
  font-size:22px;
  line-height:1;
  font-weight:400;
  color:var(--accent)
}
details[open]>summary:after {
  content:'−'
}
.service summary {
  display:flex;
  justify-content:space-between;
  gap:22px;
  font-size:15px
}
.service summary>span:first-child {
  max-width:68%
}
.price {
  color:var(--accent);
  white-space:nowrap;
  font-size:14px
}
.service-body {
  padding:2px 30px 23px 0;
  color:var(--muted);
  font-size:14px
}
.service-body .tiers {
  color:var(--text);
  margin-bottom:14px
}
.service-actions {
  display:flex;
  gap:27px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:20px;
  font-size:13px
}
.text-button {
  border:0;
  border-bottom:1px solid #3d7dff;
  background:none;
  color:var(--accent);
  padding:5px 0
}
.service-actions a {
  text-decoration:underline;
  text-underline-offset:5px
}
.pricing-note {
  font-size:12px;
  color:var(--muted);
  border-top:1px solid var(--line);
  padding-top:20px
}
.works {
  padding:38px 0 100px
}
.works .section-heading p {
  color:var(--muted);
  margin-bottom:20px
}
.underlined {
  font-size:14px;
  text-decoration:underline;
  text-underline-offset:7px
}
.process {
  padding:100px 0
}
.steps {
  padding:0;
  list-style:none;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:30px
}
.steps li {
  border-top:1px solid #929b9e;
  padding-top:17px
}
.steps li>span {
  color:#535b60;
  font-size:12px
}
.steps h3 {
  font-size:19px;
  margin:30px 0 18px
}
.steps p {
  font-size:14px;
  color:#465056;
  line-height:1.7
}
.steps small {
  display:block;
  font-size:12px;
  margin-top:22px;
  line-height:1.6
}
.principles {
  display:grid;
  grid-template-columns:1fr 1.6fr;
  gap:80px;
  border-top:1px solid #c2c8cb;
  margin-top:80px;
  padding-top:40px
}
.principles h3 {
  font-family:Manrope,sans-serif;
  font-size:38px
}
.principles p {
  padding:14px 0;
  border-bottom:1px solid #c2c8cb;
  font-size:15px
}
.faq {
  display:grid;
  grid-template-columns:1fr 1.6fr;
  gap:80px;
  padding-block:100px
}
.faq details {
  border-bottom:1px solid var(--line)
}
.faq details:first-child {
  border-top:1px solid var(--line)
}
.faq summary {
  font-size:16px
}
.faq details p {
  padding:0 30px 24px 0;
  color:var(--muted);
  font-size:14px
}
.contact {
  border-top:1px solid var(--line);
  padding-block:90px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:100px
}
.contact h2 {
  font-size:clamp(64px,6.2vw,92px)
}
.contact>div>p:last-child {
  margin-top:30px;
  color:var(--muted);
  font-size:15px
}
form {
  background:var(--panel);
  padding:32px;
  position:relative
}
form h3 {
  font-size:24px;
  margin-bottom:21px
}
label {
  display:block;
  font-size:13px;
  color:#c5c9cc;
  margin:17px 0 8px
}
input,textarea {
  background:#0f1316;
  border:1px solid #596167;
  border-radius:0;
  color:var(--text);
  width:100%;
  padding:11px 12px;
  resize:vertical
}
textarea {
  min-height:100px
}
textarea::placeholder {
  color:#9ba3a9;
  font-size:13px
}
.form-note {
  font-size:11px;
  line-height:1.7;
  color:#aeb5bb;
  margin:20px 0
}
form .button {
  width:100%
}
#form-status {
  font-size:13px;
  line-height:1.6;
  margin-top:13px
}
#form-status:empty {
  display:none
}
.honeypot {
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden
}
footer {
  border-top:1px solid var(--line);
  padding-block:35px 45px;
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  gap:25px
}
footer>div {
  display:flex;
  gap:24px;
  font-size:12px
}
footer>p {
  color:var(--muted);
  font-size:11px;
  width:100%
}
dialog {
  width:min(520px,calc(100% - 32px));
  border:1px solid #70787f;
  padding:32px;
  background:var(--panel);
  color:var(--text);
  max-height:calc(100dvh - 32px);
  overflow:auto
}
dialog::backdrop {
  background:#000b;
  backdrop-filter:blur(5px)
}
dialog h2 {
  font-size:32px;
  margin-right:35px
}
dialog>p {
  font-size:13px;
  color:var(--muted);
  margin:10px 0
}
dialog form {
  padding:0
}
dialog form h3 {
  display:none
}
.dialog-close {
  position:absolute;
  right:12px;
  top:10px;
  width:42px;
  height:42px;
  border:0;
  background:transparent;
  font-size:30px
}
#dialog-to-form {
  margin-top:20px
}
.not-found {
  padding-block:50px;
  min-height:100vh
}
.not-found>.brand {
  margin-bottom:100px
}
.not-found>p {
  margin:30px 0;
  color:var(--muted)
}
.not-found h1 {
  font-size:clamp(60px,8vw,110px)
}
@media(min-width:1500px) {
  
}
@media(max-width:1100px) {
  .wrap {
    width:calc(100% - 64px)
  }
  .section-heading {
    gap:30px
  }
  .section-heading>p,.section-heading>div {
    max-width:340px
  }
  .starter {
    padding:21px 16px
  }
  .starter>span:first-child {
    font-size:13px
  }
  .starter strong {
    font-size:31px
  }
  .starter small {
    font-size:11px
  }
  .service-group {
    gap:45px;
    grid-template-columns:1fr 1.8fr
  }
  .service summary {
    font-size:13px
  }
  .price {
    font-size:12px
  }
  .group-intro h3 {
    font-size:30px
  }
  .contact {
    gap:55px
  }
  .steps {
    gap:22px
  }
  .steps h3 {
    font-size:17px
  }
  .faq,.principles {
    gap:50px
  }
  
}
@media(max-width:720px) {
  html {
    scroll-padding-top:18px
  }
  .wrap {
    width:calc(100% - 40px)
  }
  .header {
    height:82px;
    gap:12px
  }
  .brand {
    width:139px
  }
  .header nav {
    display:none
  }
  .header-cta {
    font-size:11px;
    white-space:nowrap
  }
  .header-cta span {
    margin-left:8px;
    font-size:17px
  }
  .intro {
    font-size:11px;
    margin-bottom:22px
  }
  .button {
    font-size:13px;
    padding:13px 21px;
    min-height:49px
  }
  .section-heading {
    display:block;
    margin-bottom:32px
  }
  .section-heading h2 {
    font-size:43px
  }
  .section-heading>p,.section-heading>div {
    margin-top:24px;
    max-width:100%
  }
  .section-heading p {
    font-size:13px
  }
  .start {
    padding:55px 0
  }
  .muted {
    font-size:11px!important;
    margin-top:13px
  }
  .starter-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .starter {
    padding:20px 13px
  }
  .starter>span:first-child {
    font-size:12px;
    min-height:39px;
    line-height:1.5
  }
  .starter strong {
    font-size:28px;
    margin:13px 0 8px
  }
  .starter small {
    font-size:10px;
    min-height:30px
  }
  .starter-action {
    font-size:10px;
    gap:5px;
    margin-top:15px
  }
  .services {
    padding-block:56px 45px
  }
  .service-group {
    display:block;
    padding:31px 0 35px
  }
  .group-intro h3 {
    font-size:31px;
    max-width:100%
  }
  .group-intro p {
    max-width:100%;
    margin:14px 0;
    font-size:13px
  }
  .group-intro small {
    max-width:100%;
    margin-bottom:20px;
    font-size:11px
  }
  .service summary {
    font-size:13px;
    padding-block:18px;
    gap:12px
  }
  .service summary>span:first-child {
    max-width:61%
  }
  .price {
    font-size:11px;
    padding-top:2px
  }
  .service-body {
    font-size:12px;
    padding-right:10px
  }
  .service-actions {
    font-size:12px;
    gap:20px
  }
  .pricing-note {
    font-size:10px
  }
  .works {
    padding:15px 0 54px
  }
  .works .section-heading p {
    font-size:12px
  }
  .underlined {
    font-size:12px
  }
  .process {
    padding:55px 0
  }
  .steps {
    grid-template-columns:1fr 1fr;
    gap:30px 20px
  }
  .steps h3 {
    font-size:15px;
    margin:17px 0 12px
  }
  .steps p {
    font-size:12px
  }
  .steps small {
    font-size:10px;
    margin-top:15px
  }
  .principles {
    display:block;
    margin-top:45px;
    padding-top:27px
  }
  .principles h3 {
    font-size:32px;
    margin-bottom:18px
  }
  .principles p {
    font-size:12px;
    padding:13px 0
  }
  .faq {
    display:block;
    padding-block:55px
  }
  .faq h2 {
    font-size:43px;
    margin-bottom:28px
  }
  .faq summary {
    font-size:13px;
    padding-block:18px
  }
  .faq details p {
    font-size:12px;
    padding-right:15px
  }
  .contact {
    display:block;
    padding-block:45px 50px
  }
  .contact h2 {
    font-size:65px
  }
  .contact>div>p:last-child {
    font-size:13px;
    margin-top:23px
  }
  .contact form {
    margin-top:32px;
    padding:23px 20px
  }
  form h3 {
    font-size:21px
  }
  label {
    font-size:12px
  }
  .form-note {
    font-size:10px
  }
  footer {
    padding-block:25px 30px;
    gap:22px
  }
  footer>div {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:13px 25px;
    font-size:11px
  }
  footer>p {
    font-size:10px
  }
  dialog {
    padding:25px 21px
  }
  dialog form {
    margin-top:18px!important
  }
  .not-found>.brand {
    margin-bottom:70px
  }
  
}
.starter small {
  font-size:12px
}
.starter-action {
  font-size:12px
}
@media(max-width:720px) {
  .starter small {
    font-size:11px
  }
  .starter-action {
    font-size:11px;
    line-height:1.5
  }
  .starter-action>span {
    display:none
  }
  
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*:before,*:after {
    animation:none!important;
    transition:none!important
  }
  
}
/* 19b: световой каркас, утверждённая айдентика ТСИ. */
:root{--accent:#3d7dff;--blue:#1d6bff;--muted:#b4c2df}
h1,h2,.group-intro h3,.principles h3{font-weight:800;letter-spacing:-.055em}
h3,h4{font-weight:700}h4{margin:0;font-size:21px;line-height:1.35}
.brand{width:205px}.brand img{filter:none;mix-blend-mode:normal}
.primary{background:var(--blue);color:white}.primary:hover{background:#1556d4}
.service-marquee{overflow:hidden;border-block:1px solid var(--line);padding:20px 0;color:#8fb4ff;font-size:24px;white-space:nowrap}.service-marquee div{width:max-content;animation:marquee 36s linear infinite}.service-marquee:hover div{animation-play-state:paused}@keyframes marquee{to{transform:translateX(-50%)}}
.start{padding-block:120px}.starter strong{font-weight:800;font-size:34px;letter-spacing:-.05em}.starter{background:white}.starter:hover{background:#e6edff}.starter-action{border-color:#bac9e7}.light :focus-visible{outline-color:#1d6bff}
.services{padding-block:130px 85px}.service-group{display:block;padding:0 0 100px;border:0;scroll-margin-top:25px}.direction-visual{position:relative;overflow:hidden;aspect-ratio:2.25;margin-bottom:36px;background:#0b1c4a}.direction-visual:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#060f2bf2,transparent 85%)}.direction-visual img{width:100%;height:100%;object-fit:cover;transform:scale(1.025);transition:transform 1.8s}.direction-visual:hover img{transform:scale(1.065)}.direction-caption{position:absolute;z-index:1;bottom:44px;left:44px;max-width:680px}.direction-caption h3{font-size:clamp(28px,3.9vw,56px);line-height:1.12;letter-spacing:-.04em;max-width:650px}.direction-caption p{margin-top:15px;max-width:530px;color:#e2eaff}.scene-disclosure{position:absolute;z-index:1;right:18px;top:15px;font-size:11px;background:#060f2be6;color:#fff;padding:5px 10px}
.service-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.service{padding:28px;background:#0b1c4a;border:1px solid #294273;display:flex;flex-direction:column;min-width:0}.service h4{min-height:58px}.tier-switch{display:flex;flex-wrap:wrap;gap:5px;margin:23px 0 20px}.tier-switch button{min-height:44px;border:1px solid #5776ad;color:#dce8ff;background:transparent;padding:7px 10px;font-size:12px}.tier-switch button[aria-pressed=true]{background:#fff;color:#0b1c4a;border-color:#fff}.tier-price{font-size:clamp(28px,2.8vw,42px);font-weight:800;letter-spacing:-.05em;color:white;line-height:1.2;margin-bottom:18px;white-space:nowrap}.tier-result{color:#c3d1ec;font-size:14px;min-height:90px;line-height:1.65}.service details{border-block:1px solid #294273;margin:20px 0 0}.service summary{display:block;font-size:13px;padding:17px 25px 17px 0}.service summary:after{top:17px}.service-body{padding-right:0;font-size:13px}.service-actions{margin-top:auto;padding-top:23px;gap:16px;font-size:12px}.text-button{color:#a4c4ff;min-height:44px}.service-actions a{padding-block:12px}.works{padding-bottom:130px}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s,transform .7s}.reveal.visible{opacity:1;transform:none}
@media(max-width:1100px){.service-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.direction-caption h3{font-size:42px}}
@media(max-width:720px){.brand{width:145px}.header{gap:12px}.service-marquee{font-size:18px;padding-block:13px}.start{padding-block:64px}.section-heading h2{font-size:36px}.starter strong{font-size:25px}.services{padding-block:65px 25px}.service-group{padding-bottom:55px}.service-cards{grid-template-columns:1fr;gap:14px}.service{padding:24px}.service h4{min-height:0;font-size:21px}.tier-price{font-size:38px}.tier-result{min-height:0;font-size:14px}.tier-switch{margin-top:20px}.direction-visual{aspect-ratio:.95;margin-bottom:20px}.direction-caption{left:22px;right:22px;bottom:24px}.direction-caption h3{font-size:32px}.direction-caption p{font-size:13px;line-height:1.65}.scene-disclosure{font-size:9px;right:10px;top:10px}.works{padding-bottom:65px}.contact h2{font-size:54px}.faq h2{font-size:36px}.steps p,.steps small,.principles p,.faq summary,.faq details p{font-size:13px}.form-note,footer>p{font-size:12px}}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}.direction-visual img{transform:none}}.single-tier{min-height:44px;align-items:center;color:#b4c2df}.single-tier button{display:none}.single-tier:before{content:'Согласованный состав'}
.marquee-wrap{position:relative}.marquee-toggle{position:absolute;right:18px;top:12px;z-index:1;min-height:44px;padding:8px 14px;border:1px solid #5776ad;background:#060f2b;color:white;font-size:12px}.marquee-wrap.paused .service-marquee div{animation-play-state:paused}
@media(max-width:720px){.marquee-toggle{position:relative;top:auto;right:auto;display:block;margin:10px 20px 0 auto;min-height:44px}.service-marquee{border-top:0}.direction-caption h3{font-size:30px}}
@media(prefers-reduced-motion:reduce){.marquee-toggle{display:none}}
/* Итерация 2: убрать повторную подпись, улучшить чтение и ритм. */
.single-tier:before{content:none}.direction-caption p{max-width:480px}.service-actions a{font-size:13px}
@media(max-width:720px){.direction-caption p{font-size:14px}.scene-disclosure{font-size:10px}.tier-switch button{font-size:13px}.service-body{font-size:14px}.starter small,.starter-action{font-size:12px}.header-cta{min-height:44px}}

/* Сцены направлений — ссылки на кейсы */
a.direction-visual{display:block;color:inherit;text-decoration:none;cursor:pointer}
a.direction-visual img{transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
a.direction-visual:hover img,a.direction-visual:focus-visible img{transform:scale(1.04)}
a.direction-visual:focus-visible{outline:3px solid #3D7DFF;outline-offset:4px}
.direction-cta{position:absolute;right:24px;bottom:24px;z-index:2;padding:12px 18px;border-radius:999px;background:#1D6BFF;color:#fff;font-weight:700;font-size:15px;line-height:1.2;transition:transform .3s,background .3s}
a.direction-visual:hover .direction-cta{background:#3D7DFF;transform:translateY(-2px)}
.service-marquee,.marquee-toggle{display:none!important}
@media(max-width:720px){.direction-cta{left:16px;right:16px;bottom:16px;text-align:center}}
@media(prefers-reduced-motion:reduce){a.direction-visual img,.direction-cta{transition:none}}
.secondary{border:1px solid #7794c5;color:white;background:transparent}
.telegram-link{font-size:14px;text-decoration:underline;text-underline-offset:4px;line-height:1.5}
.header>.telegram-link{margin-left:auto;white-space:nowrap}.header-cta{margin-left:0}
.starter-groups{display:grid;grid-template-columns:2fr 1fr 1fr;gap:24px}.starter-group{min-width:0;border:0}
.starter-group>summary{font-size:19px;font-weight:700;min-height:70px;padding:0 22px 18px 0;line-height:1.4}
.starter-group .starter-grid{display:grid;grid-template-columns:1fr;gap:10px}.starter{padding:20px;text-align:left}
.starter strong{font-size:28px}.starter-deadline{font-weight:700;color:#194b9c}.starter small{line-height:1.5}
.direction-services{border:0}.direction-services>summary{padding:15px 35px 20px 0;font-size:20px;font-weight:700}
.direction-services>summary span{font-size:13px;font-weight:400;color:#b4c2df;margin-left:16px}
.tier-deadline{font-weight:700;color:#b8d0ff;margin:0 0 10px}.fixed-tier{margin:23px 0 20px;min-height:44px;display:flex;align-items:center;color:#b4c2df;font-size:13px}
.service-actions{display:flex;flex-direction:column;align-items:stretch}.service-actions .primary{font-size:14px;text-align:center;padding:14px 10px;min-height:48px}.service-actions a{align-self:flex-start;text-decoration:underline;text-underline-offset:4px}
.package-saving{font-size:14px;line-height:1.6;margin-block:18px}.first-order{padding-block:70px;display:grid;grid-template-columns:1fr 1fr;gap:40px}.first-order h2{font-size:42px}.first-order ul{padding-left:22px;line-height:1.8}.first-order li{margin-bottom:12px}
.deadline-table{overflow-x:auto;padding-bottom:20px}.deadline-table table{width:100%;border-collapse:collapse;font-size:13px}.deadline-table th,.deadline-table td{text-align:left;border-bottom:1px solid #294273;padding:12px 10px;vertical-align:top}.deadline-table td{min-width:115px}.deadline-table caption{text-align:left;padding:18px 0;color:#b4c2df}
.consent{display:flex;align-items:flex-start;gap:12px;font-size:13px;line-height:1.6;margin:20px 0}.consent input{width:22px;min-width:22px;height:22px;margin:2px 0 0;accent-color:#1d6bff}.consent a{text-decoration:underline}.response-time{font-size:14px;margin:16px 0 12px}
.mobile-contact{display:none}.privacy{max-width:850px;padding-block:50px 100px}.privacy h1{font-size:clamp(32px,5vw,58px);line-height:1.15;margin:40px 0}.privacy h2{font-size:25px;margin:35px 0 15px}.privacy p{line-height:1.8;margin:12px 0}.privacy a{text-decoration:underline}.privacy .pending{border:1px solid #5776ad;padding:18px}
.starter-group .starter-action{font-size:12px}.service-actions a{line-height:1.5}.direction-services>summary span{display:inline-block}
@media(max-width:1100px){.header>.telegram-link{font-size:12px}.header nav{gap:16px}.starter-groups{grid-template-columns:1.5fr 1fr 1fr}}
@media(max-width:720px){
 body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}.header>.telegram-link{display:none}
 .start{padding-block:38px}.start .section-heading{margin-bottom:22px}.start .section-heading h2{font-size:29px}.start .section-heading p{font-size:13px}
 .starter-groups{display:block}.starter-group{border-top:1px solid #bac9e7}.starter-group>summary{min-height:60px;font-size:16px;padding:18px 26px 18px 0}.starter-group .starter-grid{padding-bottom:18px}
 .services{padding-top:38px}.services>.section-heading{margin-bottom:25px}.direction-visual{aspect-ratio:1.75;margin-bottom:8px}.direction-caption{left:16px;right:16px;bottom:70px}.direction-caption h3{font-size:23px}.direction-caption p{display:none}.direction-cta{border-radius:0;font-size:13px;padding:10px}.service-group{padding-bottom:22px}
 .direction-services>summary{font-size:16px;padding-block:14px}.direction-services>summary span{font-size:11px;margin-left:7px}
 .first-order{padding-block:40px;grid-template-columns:1fr;gap:15px}.first-order h2{font-size:31px}.first-order ul{font-size:14px}.mobile-contact{display:flex;position:fixed;inset:auto 0 0;z-index:10;gap:12px;align-items:center;justify-content:center;background:#060f2bf5;border-top:1px solid #5776ad;padding:10px 14px calc(10px + env(safe-area-inset-bottom))}.mobile-contact .button{padding:13px;font-size:13px}.mobile-contact a{padding:13px 5px;font-size:14px}.privacy{padding-top:25px}
}
@media(max-width:720px){}
@media(prefers-reduced-motion:reduce){}
@media(prefers-reduced-motion:reduce){}

/* 21 — короткая карточка, основная ссылка покрывает её площадь. */
.service{position:relative;padding:24px;gap:12px}
.service h4{min-height:0;margin:0;font-size:21px;line-height:1.35}
.service .tier-result{min-height:0;margin:0;line-height:1.5}
.service .tier-price{font-size:32px;margin:8px 0 0;letter-spacing:-.035em}
.service .tier-deadline{margin:0;font-size:14px}
.service-actions{padding-top:8px;flex-direction:row;align-items:center;justify-content:space-between;gap:12px}
.service-actions .service-link{font-size:14px;padding-block:14px}
.service-link::after{content:'';position:absolute;inset:0;z-index:1}
.service-actions [data-lead]{position:relative;z-index:2;min-height:44px;padding:12px 16px}
.service:focus-within{outline:2px solid #8fb4ff;outline-offset:3px}
.starter{display:grid;gap:8px;text-decoration:none}
.starter strong{font-size:25px}
@media(max-width:720px){.service{padding:20px;gap:10px}.service .tier-price{font-size:30px}.starter{padding:16px}.starter-group .starter-grid{gap:8px}}
@media(min-width:721px){
 .service h4{min-height:57px}
 .service .tier-result{min-height:63px}
 .starter-group:first-child .starter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.service-actions .service-link{text-decoration:none}
.service-actions .service-link:hover{text-decoration:underline;text-underline-offset:4px}

/* Телефон: сцены направлений выше, подпись и кнопка не налезают; метки 3D-сцены внутри экрана */
@media(max-width:720px){
  a.direction-visual{aspect-ratio:4/5!important;min-height:420px;display:flex;flex-direction:column;justify-content:flex-end}
  a.direction-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  a.direction-visual .direction-caption{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;margin:0 18px 12px;z-index:2}
  a.direction-visual .direction-caption h3{font-size:28px!important;line-height:1.1}
  a.direction-visual .direction-caption p{font-size:14px!important;line-height:1.5;margin-top:8px}
  a.direction-visual .direction-cta{position:relative!important;left:auto!important;right:auto!important;bottom:auto!important;margin:0 18px 18px;display:block;text-align:center;z-index:2}
  a.direction-visual .scene-disclosure{font-size:10px!important}
  .scene-pin[data-scene="space"]{--x:72%!important}
  .scene-pin[data-scene="engineering"]{--x:26%!important}
  .scene-pin{max-width:46vw;white-space:nowrap}
}
@media(max-width:380px){}
/* Киносцена занимает весь первый экран вместе с шапкой. */
.header {position:absolute;top:0;left:0;right:0;z-index:5;height:92px;border-color:#ffffff26}
.hero {position:relative;min-height:680px;height:100svh;background:#060f2b url('../assets/kino23/poster.webp') center/cover;isolation:isolate}
.hero::after {content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#060f2bb0,transparent 80%),linear-gradient(0deg,#060f2b 0%,#060f2b22 40%,#060f2b44 100%);pointer-events:none}
.hero-video {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero-inner {height:100%;display:flex;flex-direction:column;justify-content:center;padding-top:120px;padding-bottom:158px}
.hero-copy {max-width:760px;width:70%}
.hero h1 {font-size:clamp(60px,7.1vw,108px);line-height:1.03;letter-spacing:-.05em;font-weight:500}
.hero-description {max-width:540px;font-size:16px;line-height:1.65;margin-top:24px;color:#d4def3}
.hero-actions {display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero-actions .button {font-size:14px;padding:15px 22px;margin:0}
.hero-actions .primary {background:#3d7dff;color:#fff}
.hero-actions .secondary {background:#060f2b50;border-color:#8da7d6;color:#fff}
.scene-switches {position:absolute;left:0;right:0;bottom:60px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;width:min(var(--max),calc(100% - 96px));margin-inline:auto}
.scene-choice {border-top:1px solid #ffffff40;padding-top:13px;min-width:0}
.scene-choice.is-active {border-color:#7ea9ff}
.scene-choice button {display:flex;gap:14px;align-items:flex-start;text-align:left;width:100%;padding:0;border:0;background:none;min-height:55px}
.scene-number {font-size:14px;color:#9cafd0;padding-top:3px}
.scene-choice.is-active .scene-number {color:#8bb5ff}
.scene-choice strong {font-weight:500;font-size:20px;line-height:1.3;display:block}
.scene-choice small {display:block;color:#c5d3ee;font-size:12px;line-height:1.5;margin-top:4px}
.scene-choice a {display:inline-block;font-size:12px;margin-left:23px;margin-top:4px;opacity:0;pointer-events:none}
.scene-choice.is-active a,.scene-choice:focus-within a {opacity:1;pointer-events:auto}
.film-controls {position:absolute;bottom:14px;left:0;right:0;width:min(var(--max),calc(100% - 96px));margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#a8badb}
.film-controls small {font-size:10px}
.film-controls button {border:0;background:transparent;font-size:12px;min-height:30px;padding:4px 10px}
.works {overflow:hidden;padding-block:80px 70px}
.works .section-heading {align-items:center;margin-bottom:25px}
.works .section-heading h2 {font-size:clamp(38px,4.4vw,64px)}
.work-track {display:flex;gap:24px;overflow-x:auto;padding:20px 48px;scroll-snap-type:x mandatory}
.work-card {flex:0 0 65%;scroll-snap-align:center;min-width:0}
.work-image {aspect-ratio:1.6;background:#0b1c4a;overflow:hidden;border:1px solid #426295}
.work-image img {width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .7s ease}
.work-card:hover img,.work-card:focus-visible img {transform:scale(1.06)}
.work-caption {padding-top:16px}
.work-caption h3 {font-size:20px}
.work-caption p {font-size:14px;color:var(--muted)}
.work-track.is-3d {display:block;position:relative;height:clamp(300px,35vw,500px);overflow:visible;padding:0;perspective:1400px;touch-action:pan-y;cursor:grab;scroll-snap-type:none}
.is-3d .work-card {position:absolute;left:50%;top:20px;width:min(52vw,720px);transition:transform .85s cubic-bezier(.22,.65,.25,1),opacity .85s;transform-style:preserve-3d;backface-visibility:hidden;will-change:auto}
.is-3d .work-caption {display:none}
.work-bottom {display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:18px;min-height:82px}
.active-work {max-width:70%;min-width:0}
.active-work h3 {font-size:clamp(21px,2vw,28px)}
.active-work p {color:var(--muted);font-size:14px;margin-top:7px}
.work-controls {display:flex;align-items:center;gap:14px;flex-shrink:0}
.work-controls button {border:1px solid #5776ad;background:transparent;width:44px;height:44px;font-size:20px}
.work-controls button:hover {background:#0b1c4a}
.work-controls #work-pause {width:auto;font-size:12px;padding-inline:12px}
#work-count {font-size:13px;color:var(--muted);min-width:38px;text-align:center}
.work-hint {font-size:12px;color:var(--muted);margin-top:20px}
@media(max-width:1100px) {
  .hero-copy {width:75%}
  .header {height:82px;gap:16px}
  .hero h1 {font-size:clamp(64px,8vw,88px)}
  .scene-switches {gap:18px}
  .scene-choice strong {font-size:18px}
  .header>.telegram-link {display:none}
}
@media(max-width:720px) {
  .header {height:70px}
  .hero {min-height:640px;height:100svh;background-position:76% center}
  .hero-video {object-position:76% center}
  .hero::after {background:linear-gradient(0deg,#060f2b 0%,#060f2bb3 45%,#060f2b55 100%)}
  .hero-inner {padding-top:95px;padding-bottom:233px;justify-content:center}
  .hero-copy {width:100%;max-width:480px}
  .hero h1 {font-size:clamp(45px,12vw,68px);line-height:1.04}
  .hero-description {font-size:13px;line-height:1.6;margin-top:17px;max-width:370px}
  .hero-actions {gap:8px;margin-top:18px}
  .hero-actions .button {font-size:12px;padding:11px 12px;min-height:44px}
  .scene-switches {width:calc(100% - 40px);bottom:51px;grid-template-columns:1fr;gap:5px}
  .scene-choice {position:relative;padding-top:7px;padding-bottom:3px;display:flex;align-items:center;justify-content:space-between;gap:8px}
  .scene-choice button {gap:9px;min-height:39px;width:auto;flex:1}
  .scene-choice strong {font-size:14px}
  .scene-choice small {font-size:11px;margin-top:2px;max-width:260px}
  .scene-choice a {display:none;font-size:11px;margin:0;flex:0 0 112px;line-height:1.4;white-space:nowrap}
  .scene-choice.is-active a,.scene-choice:focus-within a {display:block}
  .scene-number {font-size:11px;padding-top:2px}
  .film-controls {width:calc(100% - 40px);bottom:9px}
  .film-controls small {font-size:9px}
  .film-controls button {font-size:10px}
  .mobile-contact {transition:opacity .2s}
  body.hero-in-view .mobile-contact {visibility:hidden;pointer-events:none;opacity:0}
  .works {padding-block:48px}
  .works .section-heading {gap:20px;align-items:flex-start}
  .works .section-heading h2 {font-size:36px}
  .works .section-heading a {font-size:12px}
  .work-track.is-3d {height:240px;perspective:900px}
  .is-3d .work-card {width:78vw;top:18px}
  .work-bottom {margin-top:0;display:block;min-height:145px}
  .active-work {max-width:100%;min-height:80px}
  .active-work h3 {font-size:21px}
  .active-work p {font-size:12px}
  .work-controls {margin-top:16px;justify-content:center}
  .work-hint {font-size:11px}
}
@media(max-width:380px) {
  .hero-inner {padding-top:86px;padding-bottom:231px}
  .hero h1 {font-size:43px}
  .hero-description {font-size:12px;margin-top:14px}
  .hero-actions .button {padding-inline:10px;font-size:12px}
  .scene-choice small {font-size:10px}
  .work-track.is-3d {height:215px}
}
@media(prefers-reduced-motion:reduce) {
  .hero-video {display:none}
  .is-3d .work-card,.work-image img {transition:none}
  .work-card:hover img,.work-card:focus-visible img {transform:none}
}

/* Направление: одна строка «от …» и список услуг-ссылок на кейсы */
.direction-offer{display:grid;grid-template-columns:minmax(220px,320px) 1fr;gap:40px;align-items:start;padding:8px 0 24px}
.direction-from{display:flex;flex-direction:column;gap:6px}
.direction-from span{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#8fb4ff}
.direction-from strong{font-size:clamp(34px,4vw,52px);line-height:1.05;font-weight:800;letter-spacing:-.02em;color:#fff}
.direction-from small{font-size:14px;color:#a9b6d6;line-height:1.5}
.direction-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
.direction-list li{border-top:1px solid #1d2c57}
.direction-list a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 2px;color:#eef2ff;text-decoration:none;font-size:17px;font-weight:600;transition:color .25s,padding .25s}
.direction-list a span{color:#3D7DFF;transition:transform .25s}
.direction-list a:hover,.direction-list a:focus-visible{color:#8fb4ff;padding-left:8px;outline:none}
.direction-list a:hover span{transform:translateX(4px)}
@media(max-width:900px){.direction-offer{grid-template-columns:1fr;gap:20px}.direction-list{grid-template-columns:1fr}}
@media(max-width:720px){.direction-list a{font-size:15px;padding:14px 2px}}
@media(prefers-reduced-motion:reduce){.direction-list a,.direction-list a span{transition:none}}
