@media (max-width: 768px) {

  #rec2419183391 .t-col,

  #rec2419183391 .t976 {

    overflow: visible !important;

  }



  #rec2419183391 .t976__wrapper {

    display: flex !important;

    flex-wrap: nowrap !important;

    overflow-x: auto !important;

    overflow-y: visible !important;

    -webkit-overflow-scrolling: touch;

    scrollbar-width: none;

    padding: 0 16px 10px;

    gap: 0;

  }



  #rec2419183391 .t976__wrapper::-webkit-scrollbar {

    display: none;

  }



  #rec2419183391 .t976__list-item {

    flex-shrink: 0 !important;

    white-space: nowrap !important;

    padding: 0 10px 0 0 !important;

  }

}



#rec2419183391 {

  z-index: 900 !important;

}



/* GSS 12.10.2026: сайт шире — единые поля от края у всех блоков (решение Сергея).
   Компьютер: поля 32–64 px (4% ширины), содержимое не шире 1760 px; 961–1200: 32 px; до 960: 20 px.
   ПРАВКА: ширину и поля меняем только здесь, в --gss-pad и --gss-max. */
:root{--gss-pad:20px;--gss-max:100vw;}
@media screen and (min-width:961px){:root{--gss-pad:32px;}}
@media screen and (min-width:1201px){:root{--gss-pad:clamp(32px,4vw,64px);--gss-max:1760px;}}
/* 1) стандартные блоки Tilda: контейнер = содержимое + поля колонок */
@media screen and (min-width:1201px){
  .t-container,.t-container_flex{max-width:calc(min(var(--gss-max), 100vw - 2 * var(--gss-pad)) + 40px)!important;}
  .t-col_1{max-width:calc(100% / 12 * 1 - 40px)!important}.t-col_2{max-width:calc(100% / 12 * 2 - 40px)!important}.t-col_3{max-width:calc(100% / 12 * 3 - 40px)!important}
  .t-col_4{max-width:calc(100% / 12 * 4 - 40px)!important}.t-col_5{max-width:calc(100% / 12 * 5 - 40px)!important}.t-col_6{max-width:calc(100% / 12 * 6 - 40px)!important}
  .t-col_7{max-width:calc(100% / 12 * 7 - 40px)!important}.t-col_8{max-width:calc(100% / 12 * 8 - 40px)!important}.t-col_9{max-width:calc(100% / 12 * 9 - 40px)!important}
  .t-col_10{max-width:calc(100% / 12 * 10 - 40px)!important}.t-col_11{max-width:calc(100% / 12 * 11 - 40px)!important}.t-col_12,.t-width_12{max-width:calc(100% - 40px)!important}
  .t-prefix_1{padding-left:calc(100% / 12 * 1)!important}.t-prefix_2{padding-left:calc(100% / 12 * 2)!important}.t-prefix_3{padding-left:calc(100% / 12 * 3)!important}
  .t-prefix_4{padding-left:calc(100% / 12 * 4)!important}.t-prefix_5{padding-left:calc(100% / 12 * 5)!important}.t-prefix_6{padding-left:calc(100% / 12 * 6)!important}
}
@media screen and (min-width:961px) and (max-width:1200px){
  .t-container,.t-container_flex{max-width:calc(100vw - 2 * var(--gss-pad) + 20px)!important;}
  .t-col_1{max-width:calc(100% / 12 * 1 - 20px)!important}.t-col_2{max-width:calc(100% / 12 * 2 - 20px)!important}.t-col_3{max-width:calc(100% / 12 * 3 - 20px)!important}
  .t-col_4{max-width:calc(100% / 12 * 4 - 20px)!important}.t-col_5{max-width:calc(100% / 12 * 5 - 20px)!important}.t-col_6{max-width:calc(100% / 12 * 6 - 20px)!important}
  .t-col_7{max-width:calc(100% / 12 * 7 - 20px)!important}.t-col_8{max-width:calc(100% / 12 * 8 - 20px)!important}.t-col_9{max-width:calc(100% / 12 * 9 - 20px)!important}
  .t-col_10{max-width:calc(100% / 12 * 10 - 20px)!important}.t-col_11{max-width:calc(100% / 12 * 11 - 20px)!important}.t-col_12,.t-width_12{max-width:calc(100% - 20px)!important}
  .t-prefix_1{padding-left:calc(100% / 12 * 1)!important}.t-prefix_2{padding-left:calc(100% / 12 * 2)!important}.t-prefix_3{padding-left:calc(100% / 12 * 3)!important}
}
@media screen and (max-width:960px){.t-container,.t-container_flex{max-width:none!important;}}
/* 2) Zero-блоки с автораскладкой: поля вместо центрированной сетки */
.t396__artboard-flex{padding-left:max(var(--gss-pad), (100% - var(--gss-max)) / 2)!important;padding-right:max(var(--gss-pad), (100% - var(--gss-max)) / 2)!important;}
/* 3) подвал (Zero 850174061): группа во всю ширину, поля как у всех */
#rec850174061 .tn-group[data-group-id="1777898548725000003"]{left:0!important;width:100%!important;}
#rec850174061 #molecule-1777898548725000003{padding-left:max(var(--gss-pad), (100% - var(--gss-max)) / 2)!important;padding-right:max(var(--gss-pad), (100% - var(--gss-max)) / 2)!important;box-sizing:border-box;}
/* 4) шапка и полосы подвала со своим контейнером 1200 px (T228/T463) */
@media screen and (min-width:1201px){[class*="__maincontainer"][class*="__c12collumns"]{max-width:calc(min(var(--gss-max), 100vw - 2 * var(--gss-pad)) + 40px)!important;}}
/* 5) тёмная секция «Что я могу для вас сделать?» + «Топ проектов» — карточкой со скруглёнными углами, как hero */
#rec2446353291,#rec1569115531,#rec2446596011,#rec2483448291{margin-left:max(var(--gss-pad), (100% - var(--gss-max)) / 2);margin-right:max(var(--gss-pad), (100% - var(--gss-max)) / 2);}
#rec2446353291{border-radius:14px 14px 0 0;}
#rec2483448291{border-radius:0 0 14px 14px;}
#rec2446353291 .t396__artboard-flex,#rec1569115531 .t396__artboard-flex,#rec2446596011 .t396__artboard-flex,#rec2483448291 .t396__artboard-flex{padding-left:clamp(20px,5vw,96px)!important;padding-right:clamp(20px,5vw,96px)!important;}

/* 6) наши HTML-блоки (T131): hero, бренды, калькулятор на /cost — те же края */
#rec4692425701 .gssh{width:calc(100% - 2 * var(--gss-pad))!important;max-width:var(--gss-max)!important;margin-left:auto!important;margin-right:auto!important;}
#rec4703772101 .gb{padding-left:var(--gss-pad)!important;padding-right:var(--gss-pad)!important;}#rec4703772101 .gb-in{max-width:var(--gss-max)!important;}
@media screen and (min-width:961px){#gss-calc-root{width:calc(100% - 2 * var(--gss-pad))!important;max-width:var(--gss-max)!important;margin-left:auto!important;margin-right:auto!important;}}

/* 7) лента «Топ проектов» (Zero 2483448291 — главная и /portfolio): карточки потока на всю ширину, две колонки */
@media screen and (min-width:1201px){
  #rec2483448291 [data-group-id="1779792990399000009"],#rec2483448291 #molecule-1779792990399000009,
  #rec2483448291 [data-group-id="1779792990329000008"],#rec2483448291 #molecule-1779792990329000008{width:100%!important;}
  #rec2483448291 [data-group-id="1779792990215000001"]{width:calc(50% - 5px)!important;}
  #rec2483448291 #molecule-1779792990215000001{width:100%!important;}
}
/* на /portfolio лента идёт первой — скругление сверху у её заголовка */
#allrecords[data-tilda-page-id="152703316"] #rec2446596011{border-radius:14px 14px 0 0;margin-top:12px;}

/* 8) обложки кейсов в лентах (главная, /portfolio): всегда 16:10, как файлы обложек 1200×750 — ничего не обрезается;
      вторая лента «Все проекты» (2470908171) — тоже на всю ширину */
@media screen and (min-width:1201px){
  #rec2470908171 [data-group-id="1779792990399000009"],#rec2470908171 #molecule-1779792990399000009,
  #rec2470908171 [data-group-id="1779792990329000008"],#rec2470908171 #molecule-1779792990329000008{width:100%!important;}
  #rec2470908171 [data-group-id="1779792990215000001"]{width:calc(50% - 5px)!important;}
  #rec2470908171 #molecule-1779792990215000001{width:100%!important;}
}
:is(#rec2483448291,#rec2470908171) :is([data-elem-id="1779793288441000015"],[data-elem-id="1784054720518"],[data-elem-id="1784051880930"]){height:auto!important;aspect-ratio:16/10;flex:0 0 auto!important;min-height:0!important;overflow:hidden;}
:is(#rec2483448291,#rec2470908171) :is([data-elem-id="1779793288441000015"],[data-elem-id="1784051880930"]) > .tn-atom{height:100%!important;}
:is(#rec2483448291,#rec2470908171) [data-elem-id="1784054720518"] :is(.tn-atom,.t-slds,.t-slds__main,.t-slds__container,.t-slds__items-wrapper,.t-slds__item,.t-slds__wrapper){height:auto!important;}
:is(#rec2483448291,#rec2470908171) [data-elem-id="1784054720518"] :is(.t-null__slds-wrapper,.tn-atom__slds-img){height:auto!important;aspect-ratio:16/10;}

/* 9) тёмные большие блоки (hero и «Что я могу…» + «Топ проектов») — шире: от края экрана 20–40 px, на телефоне во всю ширину.
      Содержимое внутри остаётся на месте: внутреннее поле = край контента сайта − отступ карточки + собственное поле блока (12.10.2026). */
:root{--gss-cm:0px;}
@media screen and (min-width:640px){:root{--gss-cm:clamp(20px,2vw,40px);}}
#rec4692425701{--gssh-in:20px;}
@media screen and (min-width:640px){#rec4692425701{--gssh-in:40px;}}
@media screen and (min-width:1201px){#rec4692425701{--gssh-in:clamp(56px,5vw,96px);}}
#rec4692425701 .gssh{width:auto!important;max-width:none!important;margin-left:var(--gss-cm)!important;margin-right:var(--gss-cm)!important;
  padding-left:calc(max(var(--gss-pad), (100% - var(--gss-max)) / 2) - var(--gss-cm) + var(--gssh-in))!important;
  padding-right:calc(max(var(--gss-pad), (100% - var(--gss-max)) / 2) - var(--gss-cm) + var(--gssh-in))!important;}
#rec2446353291,#rec1569115531,#rec2446596011,#rec2483448291{margin-left:var(--gss-cm);margin-right:var(--gss-cm);}
#rec2446353291 .t396__artboard-flex,#rec1569115531 .t396__artboard-flex,#rec2446596011 .t396__artboard-flex,#rec2483448291 .t396__artboard-flex{
  padding-left:calc(max(var(--gss-pad), (100% + 2 * var(--gss-cm) - var(--gss-max)) / 2) - var(--gss-cm) + clamp(20px,5vw,96px))!important;
  padding-right:calc(max(var(--gss-pad), (100% + 2 * var(--gss-cm) - var(--gss-max)) / 2) - var(--gss-cm) + clamp(20px,5vw,96px))!important;}
@media screen and (max-width:639px){#rec4692425701 .gssh,#rec2446353291,#rec2483448291,#rec2446596011{border-radius:0!important;}}