:root{
  --bg:#070b12;
  --panel:#0b111b;
  --panel2:#0a0f18;
  --stroke:rgba(205,170,95,.22);
  --stroke2:rgba(205,170,95,.12);
  --gold:#cdaa5f;
  --gold2:#b89443;
  --text:#e7edf6;
  --muted:rgba(231,237,246,.72);
  --shadow:0 18px 60px rgba(0,0,0,.55);
  --radius:18px;
  --radius2:26px;
  --max:1120px;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }

/* ВАЖНО: body теперь без градиента */
body{
  margin:0;
  background: var(--bg);
  color:var(--text);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  letter-spacing:.2px;
  overflow-x:hidden;
}

/* ВАЖНО: единый градиент одним слоем на всю страницу (без “полос/швов”) */
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-4;
  pointer-events:none;
  background:
    radial-gradient(1200px 800px at 70% 20%, rgba(33,90,160,.18), transparent 55%),
    radial-gradient(900px 700px at 15% 35%, rgba(205,170,95,.10), transparent 60%),
    linear-gradient(180deg, #05070d 0%, var(--bg) 40%, #05070d 100%);
  transform: translateZ(0);
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }

.container{
  width:min(var(--max), calc(100% - 40px));
  margin:0 auto;
}

.bg-noise{
  position:fixed; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");
  opacity:.22;
  pointer-events:none;
  mix-blend-mode:overlay;
  z-index:-2;
}
.bg-glow{
  position:fixed; inset:-20%;
  background: radial-gradient(800px 500px at 80% 25%, rgba(60,130,220,.14), transparent 55%),
              radial-gradient(700px 500px at 25% 55%, rgba(205,170,95,.10), transparent 60%);
  filter: blur(10px);
  pointer-events:none;
  z-index:-3;
}

.header{
  position:sticky;
  top:0;
  z-index:20;
  backdrop-filter: blur(10px);
  background: linear-gradient(180deg, rgba(5,8,14,.82), rgba(5,8,14,.45));
  border-bottom:1px solid rgba(205,170,95,.10);
}
.header__row{
  height:74px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}

.brand{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--gold);
  font-family: Montserrat, Inter, system-ui, sans-serif;
  font-weight:700;
  letter-spacing:.6px;
}
.brand__mark{
  width:34px; height:34px;
  display:grid; place-items:center;
  border-radius:12px;
  border:1px solid rgba(205,170,95,.22);
  background: linear-gradient(180deg, rgba(205,170,95,.12), rgba(255,255,255,0));
  box-shadow: 0 10px 30px rgba(0,0,0,.45);
}
.brand__mark svg{ color:var(--gold); opacity:.95; }
.brand--small .brand__mark{ display:none; }

.nav{
  display:flex;
  gap:22px;
  align-items:center;
}
.nav__link{
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:1.2px;
  color:rgba(231,237,246,.72);
  position:relative;
  padding:8px 0;
}
.nav__link:hover{ color:var(--text); }
.nav__link:after{
  content:"";
  position:absolute;
  left:0; bottom:-2px;
  width:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--gold), transparent);
  transition:width .25s ease;
}
.nav__link:hover:after{ width:100%; }

.btn{
  border:1px solid rgba(205,170,95,.30);
  background:transparent;
  color:var(--gold);
  padding:10px 16px;
  border-radius:999px;
  cursor:pointer;
  font-size:13px;
  text-transform:uppercase;
  letter-spacing:1.2px;
  transition: transform .15s ease, background .2s ease, border-color .2s ease;
}
.btn:hover{ transform: translateY(-1px); border-color: rgba(205,170,95,.55); }
.btn--primary{
  background: linear-gradient(180deg, rgba(205,170,95,.28), rgba(205,170,95,.08));
  color: #ffe9b6;
  border-color: rgba(205,170,95,.45);
}
.btn--primary:hover{
  background: linear-gradient(180deg, rgba(205,170,95,.34), rgba(205,170,95,.10));
}
.btn--ghost{
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
}

.burger{
  width:40px; height:40px;
  border-radius:12px;
  border:1px solid rgba(205,170,95,.20);
  background: rgba(255,255,255,.02);
  display:none;
  place-items:center;
  gap:5px;
  padding:10px;
  cursor:pointer;
}
.burger span{
  display:block;
  width:100%;
  height:2px;
  background: rgba(231,237,246,.75);
  border-radius:2px;
}

.drawer{
  position:fixed;
  left:0; right:0; top:74px;
  height:0;
  overflow:hidden;
  background: rgba(5,8,14,.92);
  border-bottom:1px solid rgba(205,170,95,.12);
  transition: height .22s ease;
}
.drawer.is-open{ height: 240px; }
.drawer__inner{
  padding:14px 20px 18px;
  display:grid;
  gap:10px;
}
.drawer__link{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(205,170,95,.12);
  background: rgba(255,255,255,.02);
  color: rgba(231,237,246,.88);
}
.drawer__cta{ margin-top:6px; }

.hero{
  padding:56px 0 22px;
}
.hero__grid{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap:26px;
  align-items:center;
}
.tag{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(205,170,95,.18);
  color: rgba(231,237,246,.72);
  background: rgba(255,255,255,.02);
  text-transform:uppercase;
  letter-spacing:1.2px;
  font-size:12px;
}
.hero__title{
  margin:14px 0 10px;
  font-family: Montserrat, Inter, system-ui, sans-serif;
  font-weight:700;
  font-size:42px;
  line-height:1.08;
}
.hero__text{
  margin:0;
  max-width:56ch;
  color: rgba(231,237,246,.72);
  line-height:1.55;
}
.hero__actions{
  display:flex;
  gap:12px;
  margin-top:18px;
  flex-wrap:wrap;
}
.hero__stats{
  margin-top:22px;
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}
.stat{
  min-width:150px;
  padding:12px 14px;
  border-radius:16px;
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  border:1px solid rgba(205,170,95,.12);
}
.stat__num{
  font-family: Montserrat, Inter, system-ui, sans-serif;
  color:#ffe9b6;
  font-weight:700;
  font-size:18px;
}
.stat__label{
  margin-top:4px;
  color: rgba(231,237,246,.62);
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:1.1px;
}

.hero-card{
  border-radius: var(--radius2);
  border:1px solid rgba(205,170,95,.18);
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  box-shadow: var(--shadow);
  overflow:hidden;
  position:relative;
  padding:18px;
}
.hero-card__media{
  height:320px;
  display:grid;
  place-items:center;
  border-radius:20px;
  border:1px solid rgba(205,170,95,.10);
  background: radial-gradient(500px 250px at 60% 40%, rgba(60,130,220,.18), rgba(5,8,14,.0) 60%),
              linear-gradient(180deg, rgba(12,18,30,.55), rgba(12,18,30,.0));
  overflow:hidden;
}
.hero-card__fallback{
  width:100%;
  height:100%;
  position:relative;
}
.hero-card__fallback .lens{
  position:absolute;
  width:180px; height:180px;
  border-radius:50%;
  left:55%;
  top:40%;
  transform:translate(-50%,-50%);
  border:1px solid rgba(205,170,95,.22);
  background: radial-gradient(circle at 40% 40%, rgba(70,160,255,.25), rgba(0,0,0,.05) 55%, rgba(205,170,95,.08) 70%, rgba(0,0,0,.0) 100%);
  box-shadow: 0 25px 80px rgba(0,0,0,.55);
}
.hero-card__fallback .body{
  position:absolute;
  width:82%;
  height:48%;
  left:8%;
  top:48%;
  border-radius:20px;
  border:1px solid rgba(205,170,95,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0));
}
.hero-card__note{
  margin-top:12px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(205,170,95,.12);
  background: rgba(255,255,255,.02);
  color: rgba(231,237,246,.72);
  font-size:13px;
}
.dot{
  width:9px; height:9px; border-radius:50%;
  background: var(--gold);
  box-shadow: 0 0 0 6px rgba(205,170,95,.10);
}

.section{
  padding:44px 0;
}
.section__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}
.section__title{
  margin:0;
  font-family: Montserrat, Inter, system-ui, sans-serif;
  font-weight:700;
  letter-spacing:.8px;
  text-transform:uppercase;
  font-size:18px;
  color: rgba(205,170,95,.95);
}
.section__line{
  flex:1;
  height:1px;
  background: linear-gradient(90deg, rgba(205,170,95,.35), rgba(205,170,95,0));
  opacity:.9;
}
.section__footer{
  margin-top:18px;
  display:flex;
  justify-content:center;
}

.portfolio-grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:14px;
}
.card{
  border-radius:18px;
  border:1px solid rgba(205,170,95,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  overflow:hidden;
  padding:12px;
  min-height:260px;
}
.card--wide{
  grid-column: span 2;
}
.card__thumb{
  position:relative;
  height:150px;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(205,170,95,.10);
  background: rgba(0,0,0,.25);
}
.card__thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter:saturate(1.05) contrast(1.05);
  opacity:.95;
}
.play{
  position:absolute;
  left:14px; bottom:14px;
  width:44px; height:44px;
  border-radius:14px;
  border:1px solid rgba(205,170,95,.28);
  background: linear-gradient(180deg, rgba(205,170,95,.20), rgba(255,255,255,0));
  cursor:pointer;
}
.play:before{
  content:"";
  position:absolute;
  left:18px; top:14px;
  width:0; height:0;
  border-left:12px solid #ffe9b6;
  border-top:8px solid transparent;
  border-bottom:8px solid transparent;
  opacity:.9;
}
.card__title{
  margin:12px 0 6px;
  font-family: Montserrat, Inter, system-ui, sans-serif;
  font-size:14px;
  letter-spacing:.9px;
  text-transform:uppercase;
}
.card__text{
  margin:0;
  color: rgba(231,237,246,.66);
  line-height:1.45;
  font-size:13px;
}

.services{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap:12px;
}
.service{
  padding:14px 12px;
  border-radius:18px;
  border:1px solid rgba(205,170,95,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  transition: transform .15s ease, border-color .2s ease;
  min-height:120px;
}
.service:hover{ transform: translateY(-2px); border-color: rgba(205,170,95,.32); }
.service__icon{
  width:44px; height:44px;
  border-radius:16px;
  border:1px solid rgba(205,170,95,.18);
  display:grid; place-items:center;
  background: rgba(255,255,255,.02);
  margin-bottom:10px;
}
.service__title{
  font-family: Montserrat, Inter, system-ui, sans-serif;
  text-transform:uppercase;
  letter-spacing:1px;
  font-size:12px;
  color: rgba(231,237,246,.88);
}
.service__text{
  margin-top:6px;
  color: rgba(231,237,246,.62);
  font-size:12px;
  line-height:1.35;
}

.team{
  display:grid;
  grid-template-columns: 46px 1fr 46px;
  align-items:center;
  gap:12px;
}
.team__arrow{
  height:46px;
  border-radius:16px;
  border:1px solid rgba(205,170,95,.14);
  background: rgba(255,255,255,.02);
  color: rgba(231,237,246,.80);
  cursor:pointer;
  font-size:22px;
}
.team__viewport{
  overflow:hidden;
  border-radius:22px;
  border:1px solid rgba(205,170,95,.12);
  background: rgba(0,0,0,.25);
}
.team__track{
  display:flex;
  transition: transform .35s ease;
}
.team__slide{
  min-width:100%;
  height:240px;
}
.team__slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  filter: saturate(1.05) contrast(1.05);
  opacity:.95;
}

.dots{
  margin-top:12px;
  display:flex;
  justify-content:center;
  gap:8px;
}
.dot-btn{
  width:8px; height:8px;
  border-radius:99px;
  border:1px solid rgba(205,170,95,.35);
  background: rgba(255,255,255,.03);
  cursor:pointer;
  padding:0;
}
.dot-btn.is-active{
  width:22px;
  background: rgba(205,170,95,.35);
}

.contact{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:16px;
  align-items:stretch;
}
.contact__info{
  border-radius:22px;
  border:1px solid rgba(205,170,95,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  padding:16px;
  position:relative;
  overflow:hidden;
}
.contact__info:after{
  content:"";
  position:absolute;
  inset:auto -40% -60% -40%;
  height:260px;
  background: radial-gradient(circle at 50% 10%, rgba(60,130,220,.18), transparent 60%);
  filter: blur(6px);
  pointer-events:none;
}
.contact__title{
  margin:0 0 6px;
  font-family: Montserrat, Inter, system-ui, sans-serif;
  letter-spacing:.6px;
  text-transform:uppercase;
  font-size:14px;
}
.contact__text{
  margin:0;
  color: rgba(231,237,246,.68);
  line-height:1.55;
}
.contact__chips{
  margin-top:14px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.chip{
  padding:8px 10px;
  border-radius:999px;
  border:1px solid rgba(205,170,95,.12);
  background: rgba(255,255,255,.02);
  color: rgba(231,237,246,.70);
  font-size:12px;
}

.form{
  border-radius:22px;
  border:1px solid rgba(205,170,95,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  padding:16px;
}
.form--modal{
  border:none;
  background: transparent;
  padding: 0;
}
.field{
  display:grid;
  gap:6px;
  margin-bottom:12px;
}
.field__label{
  font-size:12px;
  color: rgba(231,237,246,.62);
  text-transform:uppercase;
  letter-spacing:1.1px;
}
.field__input{
  height:42px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(205,170,95,.14);
  background: rgba(5,8,14,.35);
  color: rgba(231,237,246,.92);
  outline:none;
}
.field__input:focus{
  border-color: rgba(205,170,95,.38);
  box-shadow: 0 0 0 4px rgba(205,170,95,.10);
}
.field__input--area{
  height:120px;
  resize: vertical;
}
.form__submit{ width:100%; margin-top:6px; }
.form__note{
  margin-top:10px;
  min-height:18px;
  color: rgba(231,237,246,.70);
  font-size:12px;
}

.footer{
  padding:22px 0 30px;
  border-top:1px solid rgba(205,170,95,.10);
  background: rgba(5,8,14,.35);
}
.footer__row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
}
.footer__copy{
  margin-top:8px;
  color: rgba(231,237,246,.55);
  font-size:12px;
}
.footer__right{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}
.footer__link{
  color: rgba(231,237,246,.62);
  text-transform:uppercase;
  letter-spacing:1.1px;
  font-size:12px;
}
.footer__link:hover{ color: rgba(231,237,246,.88); }

/* Modals */
.modal{
  position:fixed;
  inset:0;
  display:none;
  z-index:50;
}
.modal.is-open{ display:block; }
.modal__backdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.62);
}
.modal__panel{
  position:relative;
  width:min(640px, calc(100% - 34px));
  margin: 86px auto 0;
  border-radius:22px;
  border:1px solid rgba(205,170,95,.18);
  background: linear-gradient(180deg, rgba(10,15,24,.95), rgba(10,15,24,.85));
  box-shadow: 0 22px 80px rgba(0,0,0,.65);
  padding:16px;
}
.modal__panel--video{
  width:min(980px, calc(100% - 34px));
  padding:12px;
}
.modal__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
}
.modal__title{
  margin:0;
  font-family: Montserrat, Inter, system-ui, sans-serif;
  text-transform:uppercase;
  letter-spacing:.8px;
  font-size:14px;
  color: rgba(205,170,95,.95);
}
.modal__close{
  width:40px; height:40px;
  border-radius:14px;
  border:1px solid rgba(205,170,95,.16);
  background: rgba(255,255,255,.02);
  color: rgba(231,237,246,.80);
  cursor:pointer;
}
.modal__close--video{
  position:absolute;
  right:10px; top:10px;
  z-index:2;
}
.video-wrap{
  width:100%;
  aspect-ratio: 16 / 9;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(205,170,95,.12);
  background: rgba(0,0,0,.35);
}
.video-wrap iframe{
  width:100%;
  height:100%;
  display:block;
}

.hero-card__media--video{ position:relative; }
.hero-video{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:20px;
  display:block;
}

.brand__logo{
  height: 90px;
  width: auto;
  display: block;
  filter: drop-shadow(0 10px 22px rgba(0,0,0,.35));
}

.infinite{
  position:relative;
  border-radius:22px;
  border:1px solid rgba(205,170,95,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0));
  box-shadow: 0 18px 60px rgba(0,0,0,.35);
  overflow:hidden;
}

.infinite__viewport{
  overflow:hidden;
}

.infinite__track{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 18px;
  width:max-content;
  will-change: transform;
  animation: infinite-marquee var(--dur, 28s) linear infinite;
  transform: translate3d(0,0,0);
}

.infinite:hover .infinite__track{
  animation-play-state: paused;
}

.infinite__item{
  width:170px;
  height:60px;
  flex:0 0 auto;

  display:grid;
  place-items:center;

  border-radius:18px;
  border:1px solid rgba(205,170,95,.14);
  background: rgba(0,0,0,.20);
  transition: transform .15s ease, border-color .2s ease, background .2s ease;
}

.infinite__item:hover{
  transform: translateY(-2px);
  border-color: rgba(205,170,95,.28);
  background: rgba(255,255,255,.03);
}

.infinite__item img{
  max-width: 75%;
  max-height: 55%;
  object-fit: contain;
  opacity:.9;
  filter: saturate(1.05) contrast(1.05);
}

/* Мягкое затухание по краям, чтобы “въезд/выезд” был красивым */
.infinite__fade{
.infinite__viewport{ position:relative; z-index:1; }
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,
      rgba(7,11,18,1) 0%,
      rgba(7,11,18,0) 12%,
      rgba(7,11,18,0) 88%,
      rgba(7,11,18,1) 100%);
  mix-blend-mode: multiply;
}

@keyframes infinite-marquee{
  from { transform: translate3d(0,0,0); }
  to   { transform: translate3d(calc(-1 * var(--shift, 50%)),0,0); }
}

/* Уважение reduced motion */
@media (prefers-reduced-motion: reduce){
  .infinite__track{ animation:none; }
}

