<!-- ============================================
     DOP SOUND — MODERN THEME
     Вставка: Настройки страницы → Ещё → HEAD
     ============================================ -->






/* ============================================================
   1. ПЕРЕМЕННЫЕ
   ============================================================ */
:root{
  --ds-red:#C50C32;
  --ds-red-hover:#e01240;
  --ds-red-glow:rgba(197,12,50,.45);
  --ds-black:#0f0f10;
  --ds-dark:#141416;
  --ds-dark-2:#1a1a1c;
  --ds-dark-3:#222226;
  --ds-border:rgba(255,255,255,.07);
  --ds-text:#e8e8ea;
  --ds-text-muted:#9a9aa0;
  --ds-text-dim:#6a6a72;
  --ds-radius:18px;
  --ds-radius-sm:12px;
  --ds-shadow:0 20px 60px rgba(0,0,0,.4);
  --ds-shadow-sm:0 10px 30px rgba(0,0,0,.25);
  --ds-transition:.3s cubic-bezier(.4,0,.2,1);
}

/* ============================================================
   2. БАЗА
   ============================================================ */
html{ scroll-behavior:smooth; }

body, .t-body{
  font-family:'Manrope','TildaSans',Arial,sans-serif !important;
  background:var(--ds-black);
  color:var(--ds-text);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

h1,h2,h3,h4,h5,
.t-title, .t-heading, .t-name{
  font-family:'Manrope',sans-serif !important;
  letter-spacing:-.02em;
  font-weight:800;
  color:#fff;
}

.t-records, .t-rec{
  background-color:var(--ds-black) !important;
}

/* Выделение текста */
::selection{ background:var(--ds-red); color:#fff; }

/* Кастомный скроллбар */
::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:var(--ds-dark); }
::-webkit-scrollbar-thumb{
  background:var(--ds-dark-3);
  border-radius:6px;
  transition:background .25s;
}
::-webkit-scrollbar-thumb:hover{ background:var(--ds-red); }

/* ============================================================
   3. ОБЩИЕ КНОПКИ
   ============================================================ */
.t-btn, .t-submit, .t-btnflex{
  font-family:'Manrope',sans-serif !important;
  font-weight:700 !important;
  letter-spacing:.02em;
  border-radius:12px !important;
  transition:
    transform var(--ds-transition),
    box-shadow var(--ds-transition),
    background var(--ds-transition),
    color var(--ds-transition) !important;
}

.t-btn:hover, .t-submit:hover, .t-btnflex:hover{
  transform:translateY(-2px);
}

/* ============================================================
   4. ШАПКА (T456) — rec1657895851
   ============================================================ */
#rec1657895851 .t456__maincontainer{
  background:rgba(15,15,16,.75) !important;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  transition:background .3s ease;
}

#rec1657895851 .t456__logo,
#rec1657895851 .t-menu__link-item{
  font-weight:600 !important;
  letter-spacing:.02em;
  transition:color .25s ease, opacity .25s ease;
}

#rec1657895851 .t-menu__link-item:hover{
  color:var(--ds-red) !important;
  opacity:1 !important;
}

#rec1657895851 .t456__horizontalline{
  background:linear-gradient(
    90deg,
    transparent 0%,
    var(--ds-red) 50%,
    transparent 100%
  ) !important;
  opacity:1 !important;
  height:1px !important;
}

/* Мобильное меню */
#rec1657895851 .tmenu-mobile{
  background:rgba(15,15,16,.9) !important;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

/* ============================================================
   5. HERO (T1127) — rec1657895861
   ============================================================ */
#rec1657895861{
  background:
    radial-gradient(ellipse at 15% 0%, rgba(197,12,50,.20), transparent 55%),
    radial-gradient(ellipse at 95% 100%, rgba(197,12,50,.08), transparent 50%),
    var(--ds-black) !important;
  position:relative;
  overflow:hidden;
}

#rec1657895861 .t1127__title{
  font-size:clamp(38px, 5vw, 68px) !important;
  line-height:1.05 !important;
  font-weight:800 !important;
  letter-spacing:-.03em;
  color:#fff !important;
}

#rec1657895861 .t1127__title::after{
  content:'';
  display:block;
  width:80px;
  height:4px;
  background:var(--ds-red);
  border-radius:2px;
  margin-top:28px;
}

#rec1657895861 .t1127__descr{
  font-size:17px !important;
  line-height:1.75 !important;
  color:var(--ds-text-muted) !important;
  max-width:560px;
}

#rec1657895861 .t1127__descr strong{
  color:#fff;
  font-weight:700;
}

#rec1657895861 .t-btnflex{
  background:var(--ds-red) !important;
  padding:16px 38px !important;
  box-shadow:0 12px 30px var(--ds-red-glow) !important;
  color:#fff !important;
}

#rec1657895861 .t-btnflex:hover{
  background:var(--ds-red-hover) !important;
  box-shadow:0 18px 44px var(--ds-red-glow) !important;
  transform:translateY(-3px);
}

/* ============================================================
   6. «О СТУДИИ» (T814) — rec1657895871
   ============================================================ */
#rec1657895871 .t814__blocktext{
  background:linear-gradient(145deg, var(--ds-dark-2), var(--ds-dark)) !important;
  border:1px solid var(--ds-border);
  border-radius:var(--ds-radius) !important;
  box-shadow:var(--ds-shadow);
  padding:40px !important;
}

#rec1657895871 .t814__title{
  color:#fff !important;
  font-weight:800 !important;
  font-size:26px !important;
  margin-bottom:16px;
}

#rec1657895871 .t814__descr{
  color:var(--ds-text-muted) !important;
  line-height:1.75 !important;
  font-size:15px !important;
}

#rec1657895871 .t814__line{
  background:var(--ds-red) !important;
  opacity:1 !important;
  height:3px !important;
  width:48px !important;
  margin:16px 0 20px !important;
}

#rec1657895871 .t814__blockimg{
  border-radius:var(--ds-radius) !important;
  box-shadow:var(--ds-shadow);
  transition:transform .6s cubic-bezier(.4,0,.2,1);
  overflow:hidden;
}

#rec1657895871 .t814__blockimg:hover{
  transform:scale(1.02);
}

/* ============================================================
   7. ФОРМА (T722) — rec1657895881
   ============================================================ */
#rec1657895881 .t-cover__filter{
  background:linear-gradient(
    135deg,
    rgba(15,15,16,.95) 0%,
    rgba(15,15,16,.88) 55%,
    rgba(197,12,50,.30) 100%
  ) !important;
}

#rec1657895881 .t722__content{
  background:rgba(20,20,22,.82) !important;
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border:1px solid var(--ds-border);
  border-radius:20px !important;
  padding:48px !important;
  box-shadow:var(--ds-shadow);
}

#rec1657895881 .t722__title{
  color:#fff !important;
  font-weight:800 !important;
  font-size:clamp(24px, 3vw, 34px) !important;
  letter-spacing:-.02em;
  line-height:1.2;
}

#rec1657895881 .t722__descr{
  color:var(--ds-text-muted) !important;
  opacity:1 !important;
  font-size:15px !important;
  line-height:1.6;
}

#rec1657895881 .t-input{
  background:rgba(255,255,255,.04) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  color:#fff !important;
  border-radius:10px !important;
  padding:14px 16px !important;
  font-family:'Manrope',sans-serif !important;
  font-size:15px !important;
  transition:border-color .25s ease, background .25s ease, box-shadow .25s ease;
}

#rec1657895881 .t-input:focus{
  border-color:var(--ds-red) !important;
  background:rgba(255,255,255,.06) !important;
  box-shadow:0 0 0 3px rgba(197,12,50,.15);
  outline:none;
}

#rec1657895881 .t-input::placeholder{
  color:rgba(255,255,255,.35) !important;
  opacity:1 !important;
}

#rec1657895881 .t-input-subtitle,
#rec1657895881 .t-input-title{
  color:var(--ds-text-muted) !important;
  font-size:12px !important;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-weight:600 !important;
}

#rec1657895881 .t-submit{
  background:var(--ds-red) !important;
  padding:16px 40px !important;
  box-shadow:0 12px 30px var(--ds-red-glow) !important;
  color:#fff !important;
  font-weight:700 !important;
}

#rec1657895881 .t-submit:hover{
  background:var(--ds-red-hover) !important;
  transform:translateY(-2px);
  box-shadow:0 18px 44px var(--ds-red-glow) !important;
}

/* Сообщение об успехе */
#rec1657895881 .t-form__successbox{
  background:rgba(197,12,50,.12) !important;
  border:1px solid rgba(197,12,50,.35);
  color:#fff !important;
  border-radius:12px;
  padding:18px !important;
}

/* ============================================================
   8. УСЛУГИ (T843) — rec1714063291
   ============================================================ */
#rec1714063291{
  background:var(--ds-black) !important;
}

#rec1714063291 .t-section__title{
  font-size:clamp(30px, 4vw, 52px) !important;
  font-weight:800 !important;
  letter-spacing:-.03em;
  color:#fff !important;
  line-height:1.1;
}

#rec1714063291 .t-section__descr{
  color:var(--ds-text-muted) !important;
  font-size:17px !important;
  line-height:1.75 !important;
  max-width:640px;
  margin-left:auto;
  margin-right:auto;
}

#rec1714063291 .t843__blockimg{
  border-radius:var(--ds-radius) !important;
  box-shadow:var(--ds-shadow);
  overflow:hidden;
  transition:transform .6s cubic-bezier(.4,0,.2,1);
}

#rec1714063291 .t-item:hover .t843__blockimg{
  transform:scale(1.03);
}

#rec1714063291 .t-card__title{
  font-size:clamp(20px, 2.4vw, 28px) !important;
  font-weight:800 !important;
  color:#fff !important;
  letter-spacing:-.02em;
  line-height:1.2;
}

#rec1714063291 .t-card__descr{
  color:var(--ds-text-muted) !important;
  line-height:1.75 !important;
  font-size:15px !important;
}

/* Кнопки «Подробнее» / «Записаться» — красные */
#rec1714063291 a.t-btnflex,
#rec1714063291 .t-btnflex{
  background:var(--ds-red) !important;
  color:#fff !important;
  padding:14px 34px !important;
  box-shadow:0 10px 26px rgba(197,12,50,.28) !important;
  font-weight:700 !important;
}

#rec1714063291 a.t-btnflex:hover,
#rec1714063291 .t-btnflex:hover{
  background:var(--ds-red-hover) !important;
  transform:translateY(-2px);
  box-shadow:0 16px 36px var(--ds-red-glow) !important;
}

/* ============================================================
   9. КАРТА + КОНТАКТЫ (T433) — rec1657895911
   ============================================================ */
#rec1657895911 .t433__mainblock{
  background:var(--ds-dark) !important;
  border-radius:var(--ds-radius);
  overflow:hidden;
  box-shadow:var(--ds-shadow);
}

#rec1657895911 .t433__col_text,
#rec1657895911 .t433__contentbox{
  background:linear-gradient(160deg, var(--ds-dark-2), var(--ds-dark)) !important;
}

#rec1657895911 .t433__title{
  color:#fff !important;
  font-size:clamp(18px, 2vw, 22px) !important;
  line-height:1.65 !important;
  font-weight:600 !important;
}

#rec1657895911 .t433__title strong{
  color:#fff;
  font-weight:800;
  display:block;
  margin-bottom:12px;
  font-size:1.15em;
}

#rec1657895911 .t433__descr{
  color:var(--ds-text-muted) !important;
  font-size:14px !important;
  letter-spacing:.03em;
}

/* Соцсети в контактах — красные */
#rec1657895911 .t-sociallinks__item a{
  transition:transform .25s ease, opacity .25s ease;
  opacity:.85;
}

#rec1657895911 .t-sociallinks__item a:hover{
  transform:translateY(-4px) scale(1.08);
  opacity:1;
}

#rec1657895911 .t-sociallinks__svg path{
  fill:var(--ds-red) !important;
  transition:fill .25s ease;
}

#rec1657895911 .t-sociallinks__item a:hover .t-sociallinks__svg path{
  fill:var(--ds-red-hover) !important;
}

/* ============================================================
   10. ФУТЕР (T452) — rec1888944341
   ============================================================ */
#rec1888944341{
  background:#0a0a0b !important;
  border-top:1px solid rgba(255,255,255,.05);
}

#rec1888944341 .t452__copyright,
#rec1888944341 .t452_scrolltop{
  color:var(--ds-text-muted) !important;
  font-size:13px !important;
  letter-spacing:.05em;
  transition:color .25s ease;
}

#rec1888944341 .t452_scrolltop:hover{
  color:var(--ds-red) !important;
}

#rec1888944341 .t452__icon svg path{
  fill:currentColor;
}

#rec1888944341 .t-sociallinks__svg path{
  fill:var(--ds-text-muted) !important;
  transition:fill .25s ease;
}

#rec1888944341 .t-sociallinks__item a{
  transition:transform .25s ease;
}

#rec1888944341 .t-sociallinks__item a:hover{
  transform:translateY(-3px);
}

#rec1888944341 .t-sociallinks__item a:hover .t-sociallinks__svg path{
  fill:var(--ds-red) !important;
}

/* ============================================================
   11. СКРЫТЬ WATERMARK TILDA (опционально)
   ============================================================ */
/* .t-tildalаbеl{ display:none !important; } */

/* ============================================================
   12. АДАПТАЦИЯ
   ============================================================ */
@media (max-width:960px){
  #rec1657895881 .t722__content{
    padding:28px !important;
    border-radius:16px !important;
  }

  #rec1657895861 .t1127__title{
    font-size:34px !important;
  }

  #rec1657895861 .t1127__title::after{
    margin-top:20px;
    width:60px;
    height:3px;
  }

  #rec1714063291 .t-section__title{
    font-size:28px !important;
  }

  #rec1714063291 .t-section__descr{
    font-size:15px !important;
  }

  #rec1657895871 .t814__blocktext{
    padding:24px !important;
  }

  #rec1657895911 .t433__mainblock{
    border-radius:0;
  }

  #rec1657895911 .t433__contentbox{
    height:auto !important;
    padding:32px 20px !important;
  }
}

@media (max-width:480px){
  #rec1657895861 .t1127__title{
    font-size:28px !important;
  }

  #rec1657895881 .t722__content{
    padding:22px !important;
  }

  #rec1657895881 .t-submit{
    width:100% !important;
  }

  #rec1714063291 .t-card__title{
    font-size:18px !important;
  }
}

/* ============================================================
   13. УБИРАЕМ ЖЁЛТЫЕ/НЕСТАНДАРТНЫЕ ОБВОДКИ ИЗ TILDA
   ============================================================ */
#rec1657895881 input,
#rec1657895881 textarea{
  outline:none !important;
}

/* Убираем жёлтый бордер, который был в исходнике */
#rec1657895881 .t-input[style*="595008"]{
  border-color:rgba(255,255,255,.10) !important;
}

/* ============================================================
   14. ПЛАВНОЕ ПОЯВЛЕНИЕ БЛОКОВ (можно удалить)
   ============================================================ */
.t-rec{
  animation:dsFadeUp .7s ease both;
}

@keyframes dsFadeUp{
  from{ opacity:0; transform:translateY(20px); }
  to{ opacity:1; transform:translateY(0); }
}

/* Отключаем для блока магазина, чтобы не ломать слайдер */
#rec1951870411,
#rec1657895951{
  animation:none !important;
}

</style>
<!-- ============================================
     /DOP SOUND — MODERN THEME
     ============================================ -->