/*
Theme Name: NETSerg STUDIO
Theme URI: https://netserg.ru
Author: NETSerg STUDIO
Description: Продающий SEO-оптимизированный шаблон веб-студии NETSerg STUDIO (стиль Industry). Главная со всеми разделами, SEO-лендинги и рабочая форма заявки (AJAX, 152-ФЗ).
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: netserg
*/

/* Базовые сбросы. Основная стилизация — инлайн в шаблонах (соответствует дизайну Industry). */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html,body{overflow-x:hidden;max-width:100%}
body{margin:0;background:#f2f2f3;color:#1d1f20;font-family:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;font-size:16px;line-height:1.55}
img{max-width:100%;height:auto;display:block}
a{color:#416180;text-decoration:none}
a:hover{color:#5980a6}
::selection{background:rgba(89,128,166,.25)}
*:focus-visible{outline:2px solid #5980a6;outline-offset:2px}
summary::-webkit-details-marker{display:none}
button{font-family:inherit}

/* ===== Личный кабинет ===== */
.ns-btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 22px;background:#5980a6;color:#fff;border:1px solid #5980a6;font-weight:600;font-size:15px;letter-spacing:.03em;cursor:pointer;transition:background .2s,border-color .2s}
.ns-btn:hover{background:#416180;border-color:#416180;color:#fff}
.ns-af{margin-bottom:14px}
.ns-af label{display:block;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:#416180;margin-bottom:6px}
.ns-af input,.ns-af textarea{width:100%;min-height:44px;padding:10px 12px;background:#fff;border:1px solid rgba(29,31,32,.28);color:#1d1f20;font:inherit}
.ns-af textarea{min-height:90px;resize:vertical}
.ns-reply-form input{min-height:40px;padding:8px 12px;border:1px solid rgba(29,31,32,.28);font:inherit}
.ns-tab{padding:12px 18px;background:transparent;border:none;border-bottom:2px solid transparent;margin-bottom:-1px;font-weight:600;font-size:14px;letter-spacing:.03em;color:rgba(29,31,32,.6);cursor:pointer;transition:color .2s,border-color .2s}
.ns-tab:hover{color:#1d1f20}
.ns-tab.is-active{color:#1d1f20;border-bottom-color:#5980a6}
.ns-catrow:hover{background:rgba(89,128,166,.05)}

/* Контейнер: фон секций во всю ширину экрана, контент выровнен по центру (макс. ~1440) */
.ns-wrap{width:100%;max-width:none;margin:0 auto;position:relative;overflow:hidden}
/* Боковые поля секций: центрируют контент по сетке 1440, оставляя фон full-bleed.
   !important перебивает инлайновый padding в шаблонах (только по горизонтали). */
.ns-pad{
  padding-left:max(24px,calc(50vw - 720px + 130px)) !important;
  padding-right:max(24px,calc(50vw - 720px + 130px)) !important;
}
/* Липкая шапка — те же поля, чтобы лого/меню совпадали с контентом */
#ns-header{padding-left:max(24px,calc(50vw - 720px + 130px)) !important;padding-right:max(24px,calc(50vw - 720px + 130px)) !important}

/* ============================ АДАПТИВ ============================ */

/* --- Планшет и ниже (≤1100px) --- */
@media (max-width:1100px){
  .ns-pad,#ns-header{padding-left:6vw !important;padding-right:6vw !important}
  .ns-nav-links{display:none !important}
  /* гриды сжимаются */
  .ns-grid-2,.ns-grid-3,.ns-grid-4,.ns-grid-5,.ns-grid-6{grid-template-columns:1fr 1fr !important}
  .ns-hero,.ns-split{grid-template-columns:1fr !important;gap:44px !important}
  .ns-h1{font-size:44px !important;line-height:1.03 !important}
  .ns-h2{font-size:34px !important}
  /* строки-заголовки секций (h2 + ссылка/абзац) переносятся */
  .ns-head-row{flex-direction:column !important;align-items:flex-start !important;gap:16px !important}
}
@media (max-width:1100px) and (min-width:761px){
  .ns-grid-5{grid-template-columns:repeat(3,1fr) !important}
  .ns-grid-6{grid-template-columns:repeat(4,1fr) !important}
}

/* --- Телефон (≤760px): всё в одну колонку --- */
@media (max-width:760px){
  .ns-grid-2,.ns-grid-3,.ns-grid-4,.ns-grid-5{grid-template-columns:1fr !important}
  .ns-grid-6{grid-template-columns:repeat(3,1fr) !important}
  .ns-form-grid{grid-template-columns:1fr !important}
  .ns-tabs{overflow-x:auto;flex-wrap:nowrap !important}
  .ns-tab{white-space:nowrap}
  .ns-cms-head{display:none !important}
  .ns-cms-row{grid-template-columns:1fr !important}
  .ns-cms-row > div{border-left:none !important;padding:10px 16px !important}
  .ns-cms-row > div:first-child{font-size:12px !important;letter-spacing:.06em;text-transform:uppercase;color:#416180 !important;padding-bottom:2px !important}
}

/* --- Телефон (≤640px): типографика и ритм --- */
@media (max-width:640px){
  .ns-pad{padding-top:46px !important;padding-bottom:46px !important}
  #ns-header{padding-top:13px !important;padding-bottom:13px !important;gap:12px !important}
  .ns-h1{font-size:31px !important;line-height:1.08 !important}
  .ns-h2{font-size:25px !important;line-height:1.1 !important}
  /* убираем вертикальные разделители-обрезки у сложенных ячеек, добавляем горизонтальные */
  .ns-band > *{border-right:none !important;border-bottom:1px solid rgba(29,31,32,.12)}
  .ns-band > *:last-child{border-bottom:none !important}
  .ns-bignum{font-size:38px !important}
  /* кнопки hero — на всю ширину, удобно для пальца */
  .ns-cta-row{flex-direction:column !important;align-items:stretch !important}
  .ns-cta-row > a{justify-content:center !important}
  /* шапка: прячем телефон, ужимаем лого и кнопку */
  .ns-nav-phone{display:none !important}
  .ns-logo span{font-size:20px !important}
  .ns-nav-cta{padding:9px 13px !important;font-size:13px !important}
  .ns-nav-cab{padding:9px 11px !important;font-size:13px !important}
  .ns-nav-cab .ns-cab-txt{display:none}
  /* слайдер первого экрана чуть ниже */
  #i-hero-slides{height:320px !important}
}

/* Мелкие телефоны (≤380px) — крошим шестую сетку до 2 колонок */
@media (max-width:380px){
  .ns-grid-6{grid-template-columns:repeat(2,1fr) !important}
  .ns-h1{font-size:28px !important}
}

/* Кейсы: не дать крупной метрике и тегу расширять карточку за экран */
@media (max-width:760px){
  .ns-grid-2 > *,.ns-grid-3 > *,.ns-grid-4 > *{min-width:0}
  .ns-cases > * > div{flex-wrap:wrap}
}
@media (max-width:640px){
  .ns-case-metric{font-size:30px !important}
  .ns-case-tag{white-space:normal !important}
}