/* ============================================================
   ROOT – переменные
   ============================================================ */
:root {
  --gold: #e3ff04;
  --dark: #0a0e1a;
  --black: #000;
  --text: #b0bdcf;
  --border: rgba(255,255,255,0.08);
  --radius: 24px;
  --radius-sm: 12px;
  --transition: 0.35s cubic-bezier(.22,.61,.36,1);
  --shadow-card: 0 4px 20px rgba(0,0,0,0.04);
  --shadow-hover: 0 16px 48px rgba(0,0,0,0.08);
}

/* ============================================================
   УТИЛИТЫ (если используются в других блоках)
   ============================================================ */
.grid-2 { display: grid; grid-template-columns: repeat(2,1fr); gap:24px; }
.grid-3 { display: grid; grid-template-columns: repeat(3,1fr); gap:24px; }
.grid-auto { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px,1fr)); gap:24px; }

.card {
  background: #fff;
  border-radius: var(--radius);
  padding: 28px;
  box-shadow: var(--shadow-card);
  transition: transform var(--transition), box-shadow var(--transition);
}
.card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-hover);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 30px;
  font-weight: 700;
  cursor: pointer;
  transition: transform var(--transition), box-shadow var(--transition);
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.btn:hover { transform: scale(1.04); }

.btn-gold {
  background: var(--gold);
  color: var(--black);
  padding: 12px 32px;
}
.btn-gold:hover { box-shadow: 0 4px 24px rgba(227,255,4,0.3); }

.btn-green {
  background: #08bb0e;
  color: #fff;
  padding: 14px 40px;
}
.btn-green:hover { box-shadow: 0 4px 24px rgba(8,187,14,0.3); }

.badge {
  display: inline-block;
  padding: 4px 14px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.section-title {
  font-size: clamp(34px,5vw,48px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -0.03em;
}
.section-subtitle {
  font-size: 18px;
  color: #888;
  margin-top: 8px;
}

/* ============================================================
   СТАТИСТИКА
   ============================================================ */
.stats {
  background: var(--gold);
  padding: 64px 0;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.stats__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.18;
  pointer-events: none;
  z-index: 0;
}
.stats::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(227,255,4,0.08);
  z-index: 0;
  pointer-events: none;
}
.stats__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px,1fr));
  gap: 32px;
  position: relative;
  z-index: 1;
  padding: 0 20px;
}
.stats__item {
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 16px 20px;
  background: rgba(0,0,0,0.03);
  border-radius: var(--radius-sm);
  backdrop-filter: blur(2px);
  border: 1px solid rgba(0,0,0,0.04);
  transition: transform var(--transition), background var(--transition);
}
.stats__item:hover { transform: translateY(-4px) scale(1.01); background: rgba(0,0,0,0.06); }
.stats__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  color: rgba(0,0,0,0.35);
  transition: transform var(--transition), color var(--transition);
}
.stats__item:hover .stats__icon { transform: rotate(8deg) scale(1.1); color: rgba(0,0,0,0.6); }
.stats__icon svg {
  width: 34px;
  height: 34px;
  stroke: currentColor;
  stroke-width: 2.5;
  fill: none;
  transition: transform var(--transition);
}
.stats__item:hover .stats__icon svg { transform: scale(1.15) rotate(-4deg); stroke: rgba(0,0,0,0.7); }
.stats__number {
  font-size: 38px;
  font-weight: 900;
  color: #000;
  line-height: 1;
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}
.stats__label {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  color: rgba(0,0,0,0.6);
  margin-top: 2px;
  letter-spacing: 0.02em;
  line-height: 1.3;
}

/* ============================================================
   ПАРТНЁРЫ
   ============================================================ */
.partners {
  background: var(--dark);
  padding: 60px 0 70px;
  overflow: hidden;
  position: relative;
}
.partners__title {
  font-size: clamp(32px,5vw,52px);
  font-weight: 900;
  color: #fff;
  text-transform: uppercase;
  line-height: 1.05;
}
.partners__title span { color: var(--gold); }
.partners__desc {
  color: var(--text);
  font-size: clamp(15px,1.2vw,19px);
  margin-top: 10px;
  line-height: 1.7;
}
.partners__track {
  display: flex;
  gap: 28px;
  animation: marquee 45s linear infinite;
  width: max-content;
  padding: 8px 0;
}
.partners__track:hover { animation-play-state: paused; }
.partners__item {
  flex-shrink: 0;
  padding: 18px 36px;
  background: rgba(255,255,255,0.04);
  border-radius: var(--radius-sm);
  border: 1px solid rgba(255,255,255,0.06);
  transition: transform var(--transition), border-color var(--transition), background var(--transition), box-shadow var(--transition);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 80px;
  min-width: 160px;
}
.partners__item:hover {
  transform: scale(1.06);
  border-color: var(--gold);
  background: rgba(227,255,4,0.06);
  box-shadow: 0 0 30px rgba(227,255,4,0.06);
}
.partners__item img {
  height: 100px;
  width: auto;
  max-width: 140px;
  object-fit: contain;
  filter: grayscale(1) brightness(1.6) contrast(0.9);
  transition: filter var(--transition), transform var(--transition);
}
.partners__item:hover img { filter: grayscale(0) brightness(1); transform: scale(1.04); }
@keyframes marquee {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* ============================================================
   УСЛУГИ (services-premium) – исправлено, дубли убраны
   ============================================================ */
.services-premium {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 28px;
  margin-top: 60px;
  padding: 0;
  background: none;
  counter-reset: services;
}

.service-premium {
  position: relative;
  overflow: hidden;
  min-height: 560px;
  border-radius: 26px;
  background: #181818;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  border: 1px solid rgba(255,255,255,0.08);
  transition: transform 0.45s cubic-bezier(.22,.61,.36,1),
              box-shadow 0.45s cubic-bezier(.22,.61,.36,1),
              border-color 0.45s cubic-bezier(.22,.61,.36,1);
  transform-style: preserve-3d;
  perspective: 1200px;
  will-change: transform;
  counter-increment: services;
}
.service-premium:hover {
  transform: translateY(-12px) rotateX(2deg) rotateY(-2deg);
  border-color: #08bb0e;
  box-shadow: 0 30px 80px rgba(0,0,0,0.45), 0 0 40px rgba(8,187,14,0.18);
}
.service-premium--large,
.service-premium--wide { min-height: 640px; }

.service-premium__image {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 0.8s ease, filter 0.6s ease;
  z-index: 1;
  transform-origin: center;
}
.service-premium:hover .service-premium__image {
  transform: scale(1.09) translateZ(0);
  background-position: center 45%;
}
.service-premium__image::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at top, rgba(255,255,255,0.10), transparent 60%);
  opacity: 0.45;
}
.service-premium__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.10), rgba(0,0,0,0.18) 18%, rgba(0,0,0,0.45) 55%, rgba(0,0,0,0.90));
  z-index: 2;
  transition: background 0.45s cubic-bezier(.22,.61,.36,1);
}
.service-premium:hover .service-premium__overlay {
  background: linear-gradient(180deg, rgba(0,0,0,0.12), rgba(0,0,0,0.20), rgba(0,0,0,0.52), rgba(0,0,0,0.92));
}
.service-premium::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(8,187,14,0.10), transparent 35%, transparent 65%, rgba(255,255,255,0.05));
  opacity: 0;
  transition: 0.45s;
  z-index: 3;
}
.service-premium:hover::before { opacity: 1; }
.service-premium::after {
  content: '';
  position: absolute;
  top: -60%;
  left: -80%;
  width: 70%;
  height: 220%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.14), transparent);
  transform: rotate(18deg);
  transition: 1s;
  z-index: 4;
  pointer-events: none;
}
.service-premium:hover::after { left: 160%; }

.service-premium__content {
  position: relative;
  z-index: 10;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
  padding: 34px;
  height: 100%;
  transform: translateZ(40px);
}
.service-premium__content::before {
  content: "0" counter(services);
  position: absolute;
  top: 22px;
  right: 26px;
  font-size: 78px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.05em;
  color: rgba(255,255,255,0.05);
  pointer-events: none;
  transition: 0.4s;
}
.service-premium:hover .service-premium__content::before {
  color: rgba(8,187,14,0.12);
  transform: translateY(-6px);
}
.service-premium__content::after {
  content: '';
  position: absolute;
  left: 34px;
  right: 34px;
  bottom: 0;
  height: 2px;
  background: #08bb0e;
  transform: scaleX(0);
  transform-origin: left;
  transition: 0.45s;
}
.service-premium:hover .service-premium__content::after { transform: scaleX(1); }

.service-premium__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  padding: 10px 18px;
  margin-bottom: 22px;
  border-radius: 100px;
  background: rgba(255,255,255,0.08);
  backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,0.14);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  transition: 0.35s;
  box-shadow: 0 8px 24px rgba(0,0,0,0.18);
}
.service-premium:hover .service-premium__badge {
  background: #08bb0e;
  border-color: #08bb0e;
  transform: translateY(-2px);
}
.service-premium h3 {
  margin: 0 0 18px;
  font-size: 34px;
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.04em;
  color: #fff;
  text-shadow: 0 5px 20px rgba(0,0,0,0.45);
  transition: 0.4s;
  max-width: 90%;
}
.service-premium:hover h3 { transform: translateY(-6px); }
.service-premium p {
  margin: 0;
  font-size: 15px;
  line-height: 1.8;
  color: rgba(255,255,255,0.84);
  max-width: 95%;
  transition: 0.35s;
}
.service-premium:hover p {
  color: #fff;
  transform: translateY(-3px);
}
.service-premium p::after {
  content: '';
  display: block;
  margin-top: 18px;
  width: 58px;
  height: 3px;
  border-radius: 20px;
  background: #08bb0e;
  transition: 0.4s;
}
.service-premium:hover p::after { width: 90px; }

.service-premium ul {
  margin: 26px 0 30px;
  padding: 0;
  list-style: none;
}
.service-premium li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 14px;
  font-size: 15px;
  line-height: 1.55;
  color: #fff;
  opacity: 0.82;
  transition: padding-left 0.35s, opacity 0.35s, color 0.35s;
}
.service-premium:hover li {
  padding-left: 34px;
  opacity: 1;
  color: #fff;
}
.service-premium li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #08bb0e;
  box-shadow: 0 0 12px rgba(8,187,14,0.5);
}
.service-premium li:last-child { margin-bottom: 0; }

.service-premium__footer {
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,0.12);
  transition: transform 0.45s;
}
.service-premium:hover .service-premium__footer { transform: translateY(-2px); }
.service-premium__footer span {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.75);
}
.service-premium__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 24px;
  border-radius: 16px;
  background: #08bb0e;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: 0.35s;
  box-shadow: 0 12px 30px rgba(8,187,14,0.28);
  overflow: hidden;
  position: relative;
}
.service-premium__button::before {
  content: '';
  position: absolute;
  top: 0;
  left: -120%;
  width: 70%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent);
  transition: 0.8s;
}
.service-premium__button:hover::before { left: 150%; }
.service-premium__button:hover {
  transform: translateY(-3px);
  background: #0ac711;
  box-shadow: 0 20px 45px rgba(8,187,14,0.42);
}

/* ============================================================
   КАЛЬКУЛЯТОР
   ============================================================ */
.calculator {
  background: #fff;
  border-radius: var(--radius);
  padding: 32px;
  box-shadow: 0 8px 40px rgba(0,0,0,0.06);
  border: 1px solid #eee;
}
.calculator__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 20px;
}
.calculator__header h3 { font-size: 22px; font-weight: 700; color: #222; }
.calculator__header p { color: #888; font-size: 14px; }
.calculator__step { font-weight: 700; color: #888; }
.calculator__bar {
  width: 100%;
  height: 6px;
  background: #eee;
  border-radius: 4px;
  margin-bottom: 28px;
  overflow: hidden;
}
.calculator__bar-inner {
  width: 25%;
  height: 100%;
  background: linear-gradient(90deg, var(--gold), #c8e000);
  border-radius: 4px;
  transition: width 0.5s ease;
}
.calculator__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px,1fr));
  gap: 14px;
}
.calculator__option {
  padding: 16px 20px;
  border-radius: var(--radius-sm);
  border: 2px solid #e8e8e8;
  cursor: pointer;
  transition: var(--transition);
}
.calculator__option:hover { border-color: var(--gold); }
.calculator__option.selected {
  border-color: var(--gold);
  background: #faffeb;
}
.calculator__option label {
  font-weight: 700;
  font-size: 15px;
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  color: #222;
}
.calculator__option input[type=checkbox] {
  width: 18px;
  height: 18px;
  accent-color: var(--gold);
  cursor: pointer;
}
.calculator__option .count {
  font-size: 12px;
  background: #e8e8e8;
  padding: 2px 12px;
  border-radius: 12px;
  color: #666;
  font-weight: 600;
}
.calculator__option p {
  font-size: 13px;
  color: #888;
  margin-top: 6px;
  padding-left: 32px;
}
.calculator__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 28px;
}
.btn-primary:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

/* ============================================================
   ФОРМА
   ============================================================ */
.form-section-wrapper {
  background: #f5f6f8;
  padding: 80px 0;
}
.form-section-wrapper .section-title { color: #222; }

.form-section {
  display: grid;
  grid-template-columns: 1fr 1.5fr;
  gap: 48px;
  margin-top: 40px;
}
.form-section__info h3 {
  font-size: 24px;
  font-weight: 700;
  color: #222;
  margin-bottom: 12px;
}
.form-section__info p {
  font-size: 16px;
  color: #555;
  line-height: 1.8;
}
.form-section__contacts {
  margin-top: 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.form-section__contact {
  display: flex;
  align-items: center;
  gap: 14px;
  color: #222;
  text-decoration: none;
  font-weight: 600;
  font-size: 17px;
  transition: color var(--transition);
}
.form-section__contact:hover { color: #08bb0e; }
.form-section__contact-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(8,187,14,0.08);
  border: 1px solid rgba(8,187,14,0.08);
  flex-shrink: 0;
  transition: all var(--transition);
}
.form-section__contact:hover .form-section__contact-icon {
  background: #08bb0e;
  border-color: #08bb0e;
}
.form-section__contact-icon svg {
  width: 20px;
  height: 20px;
  stroke: #08bb0e;
  transition: stroke var(--transition);
}
.form-section__contact:hover .form-section__contact-icon svg { stroke: #fff; }

.form-card {
  background: #fff;
  padding: 32px 36px 36px;
  border-radius: var(--radius);
  box-shadow: 0 4px 20px rgba(0,0,0,0.03);
  border: 1px solid rgba(0,0,0,0.02);
  transition: box-shadow var(--transition);
}
.form-card:hover { box-shadow: 0 8px 40px rgba(0,0,0,0.04); }
.form-card__row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.form-card__row .form-card__group { flex: 1; min-width: 180px; }
.form-card__group { margin-bottom: 16px; }
.form-card__group label {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: #555;
  margin-bottom: 4px;
  letter-spacing: 0.3px;
}
.form-card__group input,
.form-card__group textarea {
  width: 100%;
  padding: 14px 18px;
  border: 2px solid #e8e8e8;
  border-radius: var(--radius-sm);
  font-size: 16px;
  transition: border-color var(--transition), box-shadow var(--transition);
  background: #fafafa;
  font-family: inherit;
}
.form-card__group input:focus,
.form-card__group textarea:focus {
  border-color: #08bb0e;
  outline: none;
  box-shadow: 0 0 0 4px rgba(8,187,14,0.06);
  background: #fff;
}
.form-card__group textarea { min-height: 110px; resize: vertical; }
.form-card__footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px;
  margin-top: 4px;
}
.form-card__footer span {
  font-size: 13px;
  color: #999;
  line-height: 1.4;
}
.form-card__btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}

/* ============================================================
   ПРЕИМУЩЕСТВА (advantages-new)
   ============================================================ */
.advantages-new {
  background: var(--black);
  padding: 80px 0;
  position: relative;
  overflow: hidden;
}
.advantages-new::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -20%;
  width: 60%;
  height: 80%;
  background: radial-gradient(ellipse, rgba(227,255,4,0.03) 0%, transparent 70%);
  pointer-events: none;
}
.advantages-new .section-title { color: #fff; }
.advantages-new .section-subtitle { color: var(--text); }
.advantages-new__grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 24px;
  margin-top: 40px;
}
.advantage-new {
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(255,255,255,0.04);
  border-radius: var(--radius);
  padding: 28px 24px 30px;
  text-align: center;
  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
  position: relative;
  overflow: hidden;
}
.advantage-new:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 48px rgba(0,0,0,0.3), 0 0 40px rgba(227,255,4,0.02);
  border-color: rgba(227,255,4,0.12);
}
.advantage-new__number {
  font-size: 56px;
  font-weight: 900;
  color: var(--gold);
  line-height: 1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  display: inline-block;
}
.advantage-new__number-wrap {
  position: relative;
  display: inline-block;
}
.advantage-new__number-wrap::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity: 0.2;
}
.advantage-new__label {
  font-size: 15px;
  font-weight: 700;
  color: #fff;
  margin-top: 12px;
  line-height: 1.4;
  letter-spacing: 0.02em;
}
.advantage-new__bar {
  width: 100%;
  max-width: 120px;
  height: 3px;
  background: rgba(255,255,255,0.04);
  border-radius: 4px;
  margin: 10px auto 0;
  overflow: hidden;
}
.advantage-new__bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--gold), #c8e000);
  border-radius: 4px;
  transition: width 1.5s cubic-bezier(0.22,1,0.36,1);
  width: 0%;
}
.advantage-new.visible .advantage-new__bar-fill { width: 100%; }
.advantage-new__icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(227,255,4,0.06);
  border: 1px solid rgba(227,255,4,0.08);
  transition: all var(--transition);
}
.advantage-new:hover .advantage-new__icon {
  background: rgba(227,255,4,0.1);
  border-color: rgba(227,255,4,0.15);
  transform: scale(1.06);
}
.advantage-new__icon svg {
  width: 28px;
  height: 28px;
  stroke: var(--gold);
}
.advantage-new__title {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 4px;
  letter-spacing: -0.02em;
}
.advantage-new__desc {
  font-size: 14px;
  color: var(--text);
  line-height: 1.6;
  max-width: 260px;
  margin: 0 auto;
}

/* ============================================================
   FAQ
   ============================================================ */
.faq__list {
  max-width: 800px;
  margin: 40px auto 0;
}
.faq__item {
  border-bottom: 1px solid var(--border);
  padding: 2px 0;
}
.faq__item:last-child { border-bottom: none; }
.faq__question {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 0;
  font-weight: 600;
  font-size: 17px;
  color: #fff;
  cursor: pointer;
  transition: color var(--transition);
  border: none;
  background: none;
  width: 100%;
  text-align: left;
}
.faq__question:hover { color: var(--gold); }
.faq__question .icon {
  font-size: 24px;
  color: var(--gold);
  transition: transform var(--transition);
  flex-shrink: 0;
  margin-left: 16px;
}
.faq__question.open .icon { transform: rotate(45deg); }
.faq__answer {
  color: var(--text);
  font-size: 15px;
  line-height: 1.8;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease, padding 0.4s ease;
  padding: 0;
}
.faq__answer.open {
  max-height: 300px;
  padding-bottom: 20px;
}

/* ============================================================
   БЛОГ (blog-new)
   ============================================================ */
.blog-new {
  background: var(--black);
  padding: 80px 0;
  position: relative;
}
.blog-new__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 40px;
}
.blog-new .section-title { color: #fff; }
.blog-new .section-subtitle { color: var(--text); margin-top: 6px; }
.blog-new__link-all {
  color: #fff;
  border: 1px solid rgba(255,255,255,0.1);
  padding: 10px 24px;
  border-radius: 30px;
  font-weight: 600;
  font-size: 14px;
  transition: all var(--transition);
  white-space: nowrap;
  text-decoration: none;
}
.blog-new__link-all:hover {
  background: rgba(227,255,4,0.04);
  border-color: var(--gold);
  color: var(--gold);
}
.blog-new__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px,1fr));
  gap: 30px;
}
.blog-new__card {
  background: rgba(255,255,255,0.02);
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.04);
  transition: transform var(--transition), box-shadow var(--transition), border-color var(--transition);
  display: flex;
  flex-direction: column;
}
.blog-new__card:hover {
  transform: translateY(-6px);
  box-shadow: 0 16px 48px rgba(0,0,0,0.3);
  border-color: rgba(227,255,4,0.08);
}
.blog-new__card-image {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16/10;
  background: #0a0e1a;
}
.blog-new__card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s ease;
}
.blog-new__card:hover .blog-new__card-image img { transform: scale(1.04); }
.blog-new__card-tag {
  position: absolute;
  bottom: 14px;
  left: 14px;
  background: rgba(0,0,0,0.7);
  backdrop-filter: blur(8px);
  color: var(--gold);
  padding: 4px 14px;
  border-radius: 20px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border: 1px solid rgba(227,255,4,0.06);
}
.blog-new__card-body {
  padding: 20px 22px 24px;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.blog-new__card-body h3 {
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 6px;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.blog-new__card-body p {
  color: var(--text);
  font-size: 14px;
  line-height: 1.6;
  flex: 1;
  margin-bottom: 14px;
}
.blog-new__card-link {
  font-weight: 600;
  color: var(--gold);
  text-decoration: none;
  transition: color var(--transition);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
}
.blog-new__card-link:hover { color: #fff; }
.blog-new__card-link::after {
  content: '→';
  transition: transform var(--transition);
}
.blog-new__card-link:hover::after { transform: translateX(4px); }

/* ============================================================
   ПОРТФОЛИО
   ============================================================ */
.portfolio {
  position: relative;
  overflow: hidden;
  background: var(--dark);
  padding: 160px 0;
}
.portfolio__noise {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");
}
.portfolio__bg-word {
  position: absolute;
  top: 40px;
  left: 50%;
  transform: translateX(-50%);
  font-size: 210px;
  font-weight: 900;
  letter-spacing: 0.22em;
  color: #fff;
  opacity: 0.025;
  user-select: none;
  pointer-events: none;
  white-space: nowrap;
}
.portfolio__header {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: auto;
  text-align: center;
  margin-bottom: 90px;
}
.portfolio__subtitle {
  display: inline-flex;
  align-items: center;
  gap: 15px;
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 13px;
}
.portfolio__subtitle::before {
  content: '';
  width: 45px;
  height: 1px;
  background: var(--gold);
}
.portfolio__title {
  margin: 30px 0 25px;
  color: #fff;
  font-size: 68px;
  line-height: 1.05;
  font-weight: 700;
}
.portfolio__title span { color: var(--gold); }
.portfolio__description {
  color: var(--text);
  font-size: 19px;
  line-height: 1.9;
}
.portfolio__grid {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12,1fr);
  gap: 28px;
  z-index: 2;
}
.project {
  grid-column: span 4;
  position: relative;
  transition: transform 0.55s cubic-bezier(0.22,0.61,0.36,1), filter 0.55s;
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: 22px;
  isolation: isolate;
  backface-visibility: hidden;
  transform-style: preserve-3d;
}
.project:hover {
  filter: drop-shadow(0 20px 60px rgba(227,255,4,0.08));
}
.project--featured { grid-column: span 8; }
.project--small .project__image { aspect-ratio: 4/3 !important; }
.project--small .project__body { min-height: 280px; }

.project a {
  display: block;
  color: inherit;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.project a:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 6px;
  border-radius: 20px;
}
.project__body {
  flex: 1;
  margin-top: -40px;
  position: relative;
  z-index: 5;
  margin-left: 22px;
  margin-right: 22px;
  padding: 34px;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(24,24,24,0.96), rgba(16,16,16,0.94));
  backdrop-filter: blur(20px);
  box-shadow: 0 10px 40px rgba(0,0,0,0.35);
  transition: transform var(--transition), box-shadow var(--transition);
}
.project:hover .project__body {
  transform: translateY(-10px);
  box-shadow: 0 25px 70px rgba(0,0,0,0.45);
}
.project__body::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  transition: 0.6s;
}
.project:hover .project__body::before { width: 100%; }
.project__body::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255,255,255,0.12), rgba(255,255,255,0), rgba(255,255,255,0.04));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
.project__image {
  position: relative;
  overflow: hidden;
  border-radius: 18px;
  aspect-ratio: 4/3;
  background: #111;
  box-shadow: 0 20px 40px rgba(0,0,0,0.35);
  transition: box-shadow var(--transition);
  backface-visibility: hidden;
  transform-style: preserve-3d;
}
.project--featured .project__image { aspect-ratio: 16/10; }
.project:hover .project__image { box-shadow: 0 35px 80px rgba(0,0,0,0.55); }
.project__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: 1s;
  filter: contrast(1.03) brightness(0.92) saturate(0.92);
  transform-origin: center;
  will-change: transform;
  image-rendering: auto;
}
.project:hover img {
  transform: scale(1.08);
  filter: contrast(1.08) brightness(1) saturate(1);
}
.project__image::before {
  content: '';
  position: absolute;
  top: -120%;
  left: -60%;
  width: 45%;
  height: 300%;
  transform: rotate(25deg);
  background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,0.22), rgba(255,255,255,0));
  transition: 1.2s;
  z-index: 5;
}
.project:hover .project__image::before { left: 160%; }
.project__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.15) 45%, rgba(0,0,0,0.85));
}
.project__number {
  position: absolute;
  top: 22px;
  left: 24px;
  font-size: 92px;
  font-weight: 900;
  color: rgba(255,255,255,0.08);
  line-height: 1;
  transition: 0.5s;
  text-shadow: 0 0 0 transparent;
}
.project:hover .project__number {
  color: rgba(227,255,4,0.18);
  transform: translateY(-8px);
  text-shadow: 0 0 30px rgba(227,255,4,0.25);
}
.project__height {
  position: absolute;
  right: 26px;
  bottom: 26px;
  font-size: 36px;
  font-weight: 700;
  color: #fff;
  padding: 12px 20px;
  border-radius: 100px;
  background: rgba(0,0,0,0.35);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255,255,255,0.08);
}
.project__category {
  color: var(--gold);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 12px;
  margin-bottom: 18px;
  position: relative;
  display: inline-block;
  padding-left: 18px;
  transition: 0.45s;
}
.project__category::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--gold);
  transform: translateY(-50%);
}
.project:hover .project__category { letter-spacing: 0.18em; }
.project h3 {
  color: #fff;
  font-size: 34px;
  line-height: 1.15;
  margin: 0 0 16px;
  transition: 0.45s;
  text-wrap: balance;
}
.project:hover h3 { color: var(--gold); }
.project p {
  color: var(--text);
  line-height: 1.8;
  margin-bottom: 28px;
  transition: 0.45s;
  max-width: 95%;
}
.project:hover p { color: #d6d6d6; }
.project__stats {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 18px;
  margin-bottom: 30px;
}
.project__stats div {
  border-top: 1px solid rgba(255,255,255,0.08);
  padding-top: 16px;
  transition: 0.45s;
}
.project:hover .project__stats div { transform: translateY(-4px); }
.project__stats strong {
  display: block;
  color: var(--gold);
  font-size: 26px;
  margin-bottom: 6px;
  transition: 0.45s;
}
.project:hover .project__stats strong { transform: translateX(3px); }
.project__stats span {
  color: #8d8d8d;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.project__button {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  margin-top: auto;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.04em;
  transition: all 0.45s ease;
}
.project__button svg {
  width: 18px;
  height: 18px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  transition: all 0.45s ease;
}
.project:hover .project__button { color: var(--gold); }
.project:hover .project__button svg { transform: translateX(8px); }
.project::before {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: 24px;
  background: radial-gradient(circle at center, rgba(227,255,4,0.12), transparent 70%);
  opacity: 0;
  transition: 0.5s;
  z-index: -1;
}
.project:hover::before { opacity: 1; }

/* Кастомная сетка портфолио */
.project--featured { grid-column: span 8; }
.project:nth-child(2) { grid-column: span 4; }
.project:nth-child(3),
.project:nth-child(4),
.project:nth-child(5) { grid-column: span 4; }
.project:nth-child(6) { display: none; }

/* ============================================================
   HERO (Слайдер)
   ============================================================ */
.hero {
  position: relative;
  min-height: clamp(600px, 80vh, 920px);
  overflow: hidden;
  background: var(--black);
  isolation: isolate;
}
.hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.8s ease;
  overflow: hidden;
  will-change: opacity;
}
.hero__slide.is-active { opacity: 1; }
.hero__slide::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(8,11,18,0.95) 0%, rgba(8,11,18,0.5) 50%, rgba(8,11,18,0.8) 100%);
}
.hero__media {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.02);
  transition: transform 8s ease;
}
.hero__slide.is-active .hero__media img { transform: scale(1); }
.hero__content {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  padding: 40px 24px;
  max-width: 700px;
  animation: heroIn 0.9s ease forwards;
}
@keyframes heroIn {
  from { opacity:0; transform:translateY(30px); }
  to { opacity:1; transform:translateY(0); }
}
.hero__eyebrow {
  font-size: clamp(14px,1.2vw,20px);
  color: rgba(255,255,255,0.5);
  font-weight: 600;
  letter-spacing: -0.02em;
  margin-bottom: 16px;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}
.hero__title {
  font-size: clamp(38px,6vw,84px);
  font-weight: 950;
  line-height: 0.94;
  letter-spacing: -0.05em;
  color: #fff;
  text-transform: uppercase;
}
.hero__title .highlight {
  background: linear-gradient(135deg, var(--gold), #c8e000);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.hero__button {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-top: 32px;
  padding: 14px 0 12px;
  border: none;
  border-bottom: 2px solid rgba(255,255,255,0.15);
  background: none;
  color: rgba(255,255,255,0.85);
  font-size: clamp(12px,0.9vw,16px);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  cursor: pointer;
  transition: var(--transition);
}
.hero__button:hover {
  color: #fff;
  border-color: var(--gold);
  transform: translateY(-2px);
}
.hero__button .arrow {
  display: inline-block;
  transition: transform var(--transition);
  font-size: 20px;
}
.hero__button:hover .arrow { transform: translateX(6px); }
.hero__person {
  position: absolute;
  z-index: 3;
  right: clamp(10px,10vw,280px);
  bottom: 8%;
  width: clamp(260px,30vw,520px);
  height: auto;
  pointer-events: none;
  filter: drop-shadow(0 30px 60px rgba(0,0,0,0.6));
  opacity: 0.92;
  animation: float-person 6s ease-in-out infinite;
}
@keyframes float-person {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-12px); }
}
.hero__controls {
  position: absolute;
  z-index: 10;
  right: clamp(16px,3vw,48px);
  bottom: clamp(20px,4vw,60px);
  display: flex;
  align-items: center;
  gap: 20px;
}
.hero__dots {
  display: flex;
  gap: 10px;
}
.hero__dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  border: none;
  background: rgba(255,255,255,0.2);
  cursor: pointer;
  transition: var(--transition);
}
.hero__dot.is-active {
  width: 34px;
  border-radius: 6px;
  background: var(--gold);
  box-shadow: 0 0 20px rgba(227,255,4,0.3);
}
.hero__dot:hover { background: rgba(255,255,255,0.5); }
.hero__arrows {
  display: flex;
  gap: 10px;
}
.hero__arrow {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.08);
  background: rgba(255,255,255,0.03);
  color: rgba(255,255,255,0.6);
  font-size: 18px;
  cursor: pointer;
  transition: var(--transition);
  backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
}
.hero__arrow:hover {
  background: rgba(255,255,255,0.08);
  border-color: rgba(255,255,255,0.2);
  color: #fff;
  transform: translateY(-2px);
}

/* ============================================================
   ARPA / ИНФО БЛОК
   ============================================================ */
.arpa-section {
  background: #000000;
  padding: 25px 0 26px;
  border-top: 1px solid rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.04);
  position: relative;
  overflow: hidden;
}
.arpa-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0;
  align-items: stretch;
  max-width: 1170px;
  margin: 0 auto;
}
.arpa-col {
  padding: 40px;
  border-radius: 3px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 200px;
}
.arpa-col-left {
  background: linear-gradient(180deg, rgba(65,214,42,0.65) 0%, #0a0a0a 97% 100%),
              url(https://alp96.ru/wp-content/uploads/2025/02/industry-mountaineer-laborers-hangs-over-residenti-2024-02-16-02-23-56-utc-1-scaled-1.jpg);
  background-size: cover;
  background-position: center;
  background-color: #6b6b6b;
}
.arpa-headline {
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
  font-weight: 600;
  color: #fff;
  font-size: 13px;
  letter-spacing: 1px;
  line-height: 1em;
  margin: 16px 0 15px;
}
.arpa-subheadline {
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
  font-weight: 700;
  color: #fff;
  font-size: 23px;
  line-height: 1.1em;
  margin: 15px 0 0;
}
.arpa-col-center {
  background: linear-gradient(180deg, rgba(43,135,218,0) 1%, rgba(10,10,10,0.69) 100%),
              url(https://alp96.ru/wp-content/uploads/2025/03/luxury-logo-mockup-копия.webp);
  background-size: cover;
  background-position: center top 51%;
  background-color: #fff;
  align-items: center;
  text-align: center;
}
.arpa-logo {
  max-width: 40%;
  height: auto;
  margin: 0 auto;
  display: block;
}
.arpa-assoc {
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
  color: #fff;
  line-height: 1em;
  margin: -5px 0 0;
  font-size: clamp(12px,1.1vw,15px);
}
.arpa-accent {
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
  font-weight: 700;
  color: #fff;
  font-size: 24px;
  line-height: 1em;
  margin: 15px 0 0;
}
.arpa-dollar-icon {
  font-family: 'ETmodules', sans-serif;
  font-weight: 400;
  font-size: 50px;
  color: #000;
  margin-top: -51px;
  margin-bottom: -18px;
  margin-left: auto;
  margin-right: auto;
  max-width: 52px;
  line-height: 1;
  text-align: center;
}
.arpa-col-right {
  background: linear-gradient(180deg, rgba(43,135,218,0) 0%, #515b00 100%),
              url(https://alp96.ru/wp-content/uploads/2025/03/фывфывфывфывфыв-копия.webp);
  background-size: cover;
  background-position: center;
  background-color: #fff;
  align-items: flex-start;
  text-align: left;
}
.arpa-training-headline {
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
  color: #fff;
  line-height: 1em;
  margin: 112px 0 0;
  font-size: clamp(16px,1.5vw,20px);
}
.arpa-slogans {
  margin-top: 26px;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.arpa-slogans p {
  font-family: 'Poppins', Helvetica, Arial, sans-serif;
  font-weight: 700;
  color: #fff;
  font-size: 24px;
  line-height: 0.8em;
  margin: 0 0 4px;
}

/* ============================================================
   МЕДИА-ЗАПРОСЫ (объединены, дубли убраны)
   ============================================================ */
@media (max-width: 1400px) {
  .services-premium {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 1200px) {
  .portfolio__grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .project {
    grid-column: auto !important;
  }
  .project__image {
    aspect-ratio: 4/3 !important;
  }
  .service-premium,
  .service-premium--large,
  .service-premium--wide {
    min-height: 520px;
  }
}
@media (max-width: 992px) {
  .portfolio__grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .project {
    grid-column: span 1 !important;
  }
  .project--featured {
    grid-column: span 2 !important;
  }
  .project:nth-child(6) {
    display: block;
  }
  .project--small {
    grid-column: span 1 !important;
  }
  .services-premium {
    gap: 22px;
  }
  .service-premium {
    border-radius: 22px;
  }
  .arpa-grid {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
  .arpa-col-center {
    order: 3;
    grid-column: span 2;
    border-top: 1px solid rgba(255,255,255,0.06);
    padding-top: 30px;
    margin-top: 10px;
  }
  .arpa-dollar-icon {
    margin-left: auto;
    margin-right: auto;
  }
  .arpa-col-right {
    align-items: flex-end;
    text-align: right;
  }
  .arpa-col-left {
    text-align: left;
  }
  .advantages-new__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 820px) {
  .arpa-grid {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
    text-align: center !important;
  }
  .arpa-col {
    text-align: center !important;
    align-items: center !important;
  }
  .arpa-col-center {
    border-top: 1px solid rgba(255,255,255,0.06);
    border-bottom: 1px solid rgba(255,255,255,0.06);
    padding: 30px 20px;
  }
  .arpa-training-headline {
    margin-top: 20px;
  }
  .arpa-logo {
    max-width: 60%;
  }
}
@media (max-width: 768px) {
  /* Статистика */
  .stats {
    padding: 48px 0;
  }
  .stats__grid {
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    padding: 0 12px;
  }
  .stats__item {
    padding: 12px 16px;
    gap: 12px;
  }
  .stats__number {
    font-size: 30px;
  }
  .stats__icon svg {
    width: 26px;
    height: 26px;
  }
  .stats__label {
    font-size: 11px;
  }

  /* Партнёры */
  .partners {
    padding: 40px 0 50px;
  }
  .partners__item {
    padding: 14px 24px;
    min-height: 60px;
    min-width: 120px;
  }
  .partners__item img {
    height: 100px;
    max-width: 100px;
  }
  .partners__track {
    gap: 18px;
  }

  /* Услуги */
  .services-premium {
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .service-premium {
    min-height: 430px;
  }
  .service-premium--large,
  .service-premium--wide {
    min-height: 430px;
  }
  .service-premium__image {
    transition: transform 0.4s;
  }
  .service-premium:hover .service-premium__image {
    transform: scale(1.04);
  }
  .service-premium__content {
    padding: 24px;
  }
  .service-premium h3 {
    font-size: 27px;
  }
  .service-premium p {
    font-size: 14px;
  }
  .service-premium li {
    font-size: 14px;
  }
  .service-premium__footer {
    flex-direction: column;
    align-items: flex-start;
  }
  .service-premium__button {
    width: 100%;
  }

  /* Форма */
  .form-section-wrapper {
    padding: 56px 0;
  }
  .form-section {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .form-card {
    padding: 24px 20px 28px;
  }
  .form-section__contact {
    font-size: 15px;
  }
  .form-section__contact-icon {
    width: 38px;
    height: 38px;
  }
  .form-section__contact-icon svg {
    width: 17px;
    height: 17px;
  }
  .form-card__btn {
    width: 100%;
    justify-content: center;
  }

  /* Портфолио */
  .portfolio {
    padding: 100px 0;
  }
  .portfolio__title {
    font-size: 44px;
  }
  .portfolio__description {
    font-size: 17px;
  }
  .portfolio__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .project {
    grid-column: auto !important;
  }
  .project__body {
    margin-left: 14px;
    margin-right: 14px;
    padding: 24px;
  }
  .project h3 {
    font-size: 28px;
  }
  .project__stats {
    grid-template-columns: repeat(3, 1fr);
  }
  .portfolio__bg-word {
    font-size: 90px;
  }

  /* Hero */
  .hero__person {
    right: -60px;
    bottom: 20px;
    width: 65vw;
    opacity: 0.5;
  }
  .hero__content {
    padding-top: 60px;
  }

  /* Блог */
  .blog-new {
    padding: 56px 0;
  }
  .blog-new__grid {
    grid-template-columns: 1fr 1fr;
    gap: 20px;
  }
  .blog-new__header {
    flex-direction: column;
    align-items: flex-start;
  }
  .blog-new__link-all {
    align-self: flex-start;
  }

  /* Преимущества */
  .advantages-new {
    padding: 56px 0;
  }

  /* Калькулятор */
  .calculator__grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 600px) {
  .advantages-new__grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .advantage-new__number {
    font-size: 44px;
  }
  .advantage-new__icon {
    width: 48px;
    height: 48px;
  }
  .advantage-new__icon svg {
    width: 24px;
    height: 24px;
  }
}
@media (max-width: 576px) {
  .portfolio__grid {
    grid-template-columns: 1fr !important;
  }
  .project {
    grid-column: span 1 !important;
  }
  .project--featured {
    grid-column: span 1 !important;
  }
}
@media (max-width: 480px) {
  /* Статистика */
  .stats__grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .stats__item {
    padding: 10px 14px;
  }
  .stats__number {
    font-size: 28px;
  }

  /* Партнёры */
  .partners__item {
    padding: 10px 16px;
    min-height: 50px;
    min-width: 90px;
  }
  .partners__item img {
    height: 28px;
    max-width: 80px;
  }
  .partners__track {
    gap: 12px;
  }

  /* Услуги */
  .services-premium {
    margin-top: 40px;
  }
  .service-premium {
    border-radius: 18px;
  }
  .service-premium__content {
    padding: 20px;
  }
  .service-premium h3 {
    font-size: 24px;
  }
  .service-premium p {
    font-size: 14px;
    line-height: 1.7;
  }
  .service-premium ul {
    margin: 18px 0 24px;
  }
  .service-premium li {
    font-size: 13px;
    padding-left: 24px;
    margin-bottom: 10px;
  }
  .service-premium__badge {
    font-size: 11px;
    padding: 8px 14px;
    margin-bottom: 16px;
  }
  .service-premium__footer {
    padding-top: 18px;
  }
  .service-premium__button {
    padding: 13px 18px;
    font-size: 13px;
  }

  /* Форма */
  .form-card__row {
    flex-direction: column;
    gap: 0;
  }
  .form-card__row .form-card__group {
    min-width: unset;
  }

  /* Портфолио */
  .project__stats {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .project__height {
    font-size: 22px;
    padding: 10px 16px;
  }
  .project__number {
    font-size: 70px;
  }
  .project h3 {
    font-size: 24px;
  }
  .portfolio__title {
    font-size: 34px;
  }
  .portfolio__subtitle {
    font-size: 11px;
    letter-spacing: 0.18em;
  }

  /* Hero */
  .hero__controls {
    bottom: 12px;
    right: 12px;
    gap: 12px;
  }
  .hero__arrow {
    width: 36px;
    height: 36px;
    font-size: 14px;
  }
  .hero__dot.is-active {
    width: 28px;
  }

  /* Блог */
  .blog-new__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .blog-new__card-body h3 {
    font-size: 17px;
  }

  /* Преимущества */
  .advantages-new__grid {
    gap: 12px;
  }
  .advantage-new {
    padding: 20px 16px 22px;
  }
  .advantage-new__number {
    font-size: 38px;
  }

  /* Arpa */
  .arpa-section {
    padding: 24px 0;
  }
  .arpa-logo {
    height: 50px;
  }
  .arpa-title {
    font-size: 14px;
  }
  .arpa-accent {
    font-size: 20px;
  }
  .arpa-training-icon {
    font-size: 26px;
  }
  .arpa-training-title,
  .arpa-slogan-title {
    font-size: 14px;
  }
}
.services{

    padding:120px 0;

    position:relative;

    overflow:hidden;

}

.services .text-center{

    max-width:760px;

    margin:0 auto 70px;

}

.services .subtitle{

    margin-bottom:18px;

}

.services-peak__title{

    margin:0 0 22px;

    font-size:56px;

    font-weight:800;

    line-height:1.1;

    color:#fff;

}

.services-peak__subtitle{

    margin:0;

    font-size:20px;

    line-height:1.7;

    color:rgba(255,255,255,.75);

}
.services .container{

    max-width:1680px;

    width:95%;

}




















/* ============================================================
   КАЛЬКУЛЯТОР
   ============================================================ */
   /* ==========================================================
   PREMIUM CALCULATOR 2026
   ЧАСТЬ 1 — ОСНОВА
========================================================== */

#inalto-calculator{

    --calc-bg:#f5f7fa;
    --card-bg:#ffffff;
    --card-border:#e5e7eb;
    --accent:#ffbe0b;
    --accent-dark:#f5a300;
    --text:#222;
    --text-light:#707780;
    --shadow:0 15px 40px rgba(0,0,0,.08);
    --shadow-hover:0 20px 55px rgba(0,0,0,.14);

    max-width:1600px !important;
    margin:auto;
}

/* фон */

#inalto-calculator > .bg-white{

    background:var(--calc-bg)!important;
    border:none!important;
    box-shadow:none!important;
    overflow:visible!important;

}

/* заголовок */

#inalto-calculator h1{

    font-size:40px!important;
    font-weight:800!important;
    color:#222!important;
    letter-spacing:-.5px;

}

#inalto-calculator h2{

    font-size:30px!important;
    font-weight:700!important;
    color:#222!important;

}

#inalto-calculator p{

    color:#6d7680!important;
    line-height:1.7;

}

/* шаг */

.progress-bar-inner{

    background:linear-gradient(90deg,#ffcb2d,#ffb100)!important;
    border-radius:30px;

}

/* сетка категорий */

#inalto-calculator .grid{

    display:grid!important;

    grid-template-columns:repeat(3,minmax(0,1fr))!important;

    gap:26px!important;

}

/* планшет */

@media(max-width:1200px){

#inalto-calculator .grid{

grid-template-columns:repeat(2,1fr)!important;

}

}

/* телефон */

@media(max-width:768px){

#inalto-calculator .grid{

grid-template-columns:1fr!important;

}

}

/* ==========================================================
   КАРТОЧКИ
========================================================== */

#inalto-calculator .rounded-2xl.border.border-gray-200.bg-white{

    position:relative;

    background:#fff!important;

    border:none!important;

    border-radius:22px!important;

    overflow:hidden;

    transition:.35s;

    box-shadow:var(--shadow);

}

/* желтая полоса */

#inalto-calculator .rounded-2xl.border.border-gray-200.bg-white::before{

content:"";

position:absolute;

left:0;

top:0;

bottom:0;

width:7px;

background:linear-gradient(180deg,#ffcf33,#ffb300);

transition:.3s;

}

/* hover */

#inalto-calculator .rounded-2xl.border.border-gray-200.bg-white:hover{

transform:translateY(-8px);

box-shadow:var(--shadow-hover);

}

/* выбранная */

#inalto-calculator .rounded-2xl.border.border-gray-200.bg-white:has(input:checked){

box-shadow:

0 0 0 2px rgba(255,190,11,.35),

0 20px 50px rgba(255,185,0,.18);

}

#inalto-calculator .rounded-2xl.border.border-gray-200.bg-white:has(input:checked)::before{

width:11px;

}

/* внутренности */

#inalto-calculator .p-4,
#inalto-calculator .p-5{

padding:24px!important;

}

/* заголовок карточки */

#inalto-calculator .font-bold.text-gray-900{

font-size:22px!important;

font-weight:700!important;

color:#202124!important;

line-height:1.3;

}

/* описание */

#inalto-calculator .text-sm.text-gray-500{

font-size:15px!important;

line-height:1.7!important;

color:#78828d!important;

margin-top:12px!important;

}

/* количество услуг */

#inalto-calculator .text-xs.px-2.py-0\.5.rounded-full{

padding:8px 16px!important;

border-radius:50px!important;

background:#fff6d7!important;

color:#996600!important;

font-size:13px!important;

font-weight:700!important;

border:1px solid rgba(255,190,11,.25);

white-space:nowrap;

}

/* чекбокс */

#inalto-calculator input[type=checkbox]{

width:22px;

height:22px;

cursor:pointer;

accent-color:#ffb300;

}

/* кнопка раскрытия */

#inalto-calculator button[data-action="toggle-expand-cat"]{

height:46px!important;

padding:0 20px!important;

border-radius:14px!important;

background:#fff!important;

border:1px solid #e5e7eb!important;

font-weight:700!important;

transition:.3s;

}

#inalto-calculator button[data-action="toggle-expand-cat"]:hover{

background:#ffbe0b!important;

color:#222!important;

border-color:#ffbe0b!important;

transform:translateY(-2px);

}

/* низ карточки */

#inalto-calculator .mt-6{

margin-top:40px!important;

}
/* ==========================================================
   PREMIUM CALCULATOR 2026
   ЧАСТЬ 2 — РАСКРЫТИЕ КАТЕГОРИЙ И СПИСКИ УСЛУГ
========================================================== */

/* красивое раскрытие */

.category-services,
.services-list,
[data-role="services"],
[data-category-services]{

    animation:servicesFade .35s ease;

}

@keyframes servicesFade{

    from{

        opacity:0;
        transform:translateY(-10px);

    }

    to{

        opacity:1;
        transform:translateY(0);

    }

}

/* блок со списком */

#inalto-calculator .rounded-xl,
#inalto-calculator .border-t{

    border-color:#eceff3!important;

}

#inalto-calculator .bg-gray-50{

    background:#fafbfc!important;

}

/* внутренний контейнер услуг */

#inalto-calculator .space-y-2,
#inalto-calculator .space-y-3{

    display:grid!important;

    grid-template-columns:repeat(2,minmax(0,1fr));

    gap:14px;

}

@media(max-width:900px){

#inalto-calculator .space-y-2,
#inalto-calculator .space-y-3{

grid-template-columns:1fr;

}

}

/* одна услуга */

#inalto-calculator .service-item,
#inalto-calculator label:has(input[data-action="toggle-service"]){

    display:flex;

    align-items:flex-start;

    gap:12px;

    padding:14px 16px;

    border-radius:14px;

    background:#fff;

    border:1px solid #eceff3;

    transition:.25s;

    cursor:pointer;

}

/* hover */

#inalto-calculator .service-item:hover,
#inalto-calculator label:has(input[data-action="toggle-service"]):hover{

    transform:translateY(-2px);

    border-color:#ffcb39;

    box-shadow:0 10px 25px rgba(0,0,0,.08);

}

/* выбранная услуга */

#inalto-calculator .service-item:has(input:checked),
#inalto-calculator label:has(input[data-action="toggle-service"]:checked){

    border-color:#ffbe0b;

    background:#fffdf5;

    box-shadow:0 0 0 2px rgba(255,190,11,.18);

}

/* чекбокс */

#inalto-calculator .service-item input,
#inalto-calculator label input{

    margin-top:3px;

    width:20px;

    height:20px;

}

/* название */

#inalto-calculator .service-item strong,
#inalto-calculator .service-item b{

    font-size:16px;

    color:#202124;

}

/* описание */

#inalto-calculator .service-item small,
#inalto-calculator .service-item .text-xs{

    color:#7b8692;

    line-height:1.5;

}

/* цена */

#inalto-calculator .price,
#inalto-calculator .service-price{

    margin-left:auto;

    font-weight:700;

    color:#ff9900;

    white-space:nowrap;

}

/* ==========================================================
   КНОПКА "ДАЛЕЕ"
========================================================== */

#inalto-calculator button[data-step]{

    height:58px!important;

    padding:0 34px!important;

    border-radius:16px!important;

    font-size:16px!important;

    font-weight:700!important;

    background:linear-gradient(135deg,#ffd33d,#ffb400)!important;

    box-shadow:0 14px 35px rgba(255,180,0,.35);

    transition:.3s;

}

#inalto-calculator button[data-step]:hover{

    transform:translateY(-3px);

    box-shadow:0 20px 45px rgba(255,180,0,.45);

}

#inalto-calculator button[data-step]:disabled{

    opacity:.45;

    transform:none;

    box-shadow:none;

}

/* ==========================================================
   СЧЕТЧИК
========================================================== */

#inalto-calculator .mt-6 .text-sm{

    font-size:16px!important;

    color:#5f6771!important;

}

#inalto-calculator .mt-6 strong{

    color:#ff9900;

    font-size:20px;

}
/* ==========================================================
   PREMIUM CALCULATOR 2026
   ЧАСТЬ 3 — НИЖНЯЯ ПАНЕЛЬ
========================================================== */

/* липкая панель */

#inalto-calculator .sticky{

    position:sticky!important;
    bottom:20px!important;

    margin-top:50px!important;

    padding:22px 28px!important;

    border-radius:24px!important;

    background:rgba(255,255,255,.92)!important;

    backdrop-filter:blur(20px);

    border:1px solid rgba(255,255,255,.5)!important;

    box-shadow:
        0 15px 50px rgba(0,0,0,.12),
        0 5px 15px rgba(0,0,0,.05)!important;

    z-index:50;

}

/* контейнер */

#inalto-calculator .sticky > div{

    display:flex;

    align-items:center;

    justify-content:space-between;

    gap:30px;

}

/* цена */

#total-price-container{

    display:flex;

    flex-direction:column;

    justify-content:center;

}

#total-price-container .font-bold{

    font-size:42px!important;

    font-weight:800!important;

    color:#222!important;

    line-height:1;

    letter-spacing:-1px;

}

#total-price-container .text-xs{

    margin-top:8px;

    font-size:14px!important;

    color:#7d8590!important;

}

/* кнопки справа */

#inalto-calculator .sticky .flex.items-center{

    gap:16px!important;

}

/* все кнопки */

#inalto-calculator .sticky button,
#inalto-calculator .sticky a{

    height:56px!important;

    border-radius:16px!important;

    transition:.3s;

    font-weight:700!important;

}

/* PDF */

button[data-action="download-pdf"]{

    padding:0 24px!important;

    background:#fff!important;

    border:1px solid #e5e7eb!important;

}

button[data-action="download-pdf"]:hover{

    background:#f7f8fa!important;

    transform:translateY(-2px);

}

/* поделиться */

button[data-action="share"]{

    width:56px!important;

    background:#fff!important;

    border:1px solid #e5e7eb!important;

}

button[data-action="share"]:hover{

    background:#f7f8fa!important;

    transform:translateY(-2px);

}

/* консультация */

#inalto-calculator .sticky a{

    padding:0 34px!important;

    background:linear-gradient(135deg,#ffd94d,#ffb200)!important;

    border:none!important;

    color:#222!important;

    box-shadow:0 12px 30px rgba(255,180,0,.35);

}

#inalto-calculator .sticky a:hover{

    transform:translateY(-3px);

    box-shadow:0 20px 45px rgba(255,180,0,.45);

}

/* иконки */

#inalto-calculator svg{

    transition:.25s;

}

#inalto-calculator button:hover svg,
#inalto-calculator a:hover svg{

    transform:scale(1.15);

}

/* мобильная версия */

@media(max-width:900px){

#inalto-calculator .sticky{

padding:18px!important;

border-radius:18px!important;

}

#inalto-calculator .sticky>div{

flex-direction:column;

align-items:stretch;

}

#total-price-container{

text-align:center;

}

#total-price-container .font-bold{

font-size:34px!important;

}

#inalto-calculator .sticky .flex.items-center{

justify-content:center;

flex-wrap:wrap;

}

#inalto-calculator .sticky button,
#inalto-calculator .sticky a{

flex:1;

min-width:140px;

}

}

/* ==========================================================
   МЕЛКИЕ ДЕТАЛИ
========================================================== */

/* плавность */

#inalto-calculator *{

transition:
background .25s,
border-color .25s,
box-shadow .25s,
transform .25s;

}

/* скролл */

#inalto-calculator{

scroll-margin-top:120px;

}

/* выделение текста */

#inalto-calculator ::selection{

background:#ffd95c;

color:#222;

}



/* ==========================================================
   PREMIUM CALCULATOR 2026
   PART 1
========================================================== */

:root{

    --calc-bg:#f5f7fb;
    --calc-card:#ffffff;
    --calc-dark:#171717;

    --calc-text:#30343b;
    --calc-text-light:#737b87;

    --calc-border:#e7ebf2;

    --calc-yellow:#FDB913;
    --calc-yellow-dark:#e0a200;

    --calc-shadow:
        0 15px 45px rgba(20,25,40,.08);

    --calc-shadow-hover:
        0 25px 60px rgba(20,25,40,.15);

    --radius:26px;

    --transition:.35s cubic-bezier(.2,.8,.2,1);

}


/* ========================================================== */

.calc-section{

    position:relative;

    overflow:hidden;

    background:var(--calc-bg);

    padding:120px 0;

}


/* ========================================================== */

.calc-bg{

    position:absolute;

    inset:0;

    overflow:hidden;

    pointer-events:none;

}


/* ========================================================== */

.blur{

    position:absolute;

    border-radius:50%;

    filter:blur(120px);

    opacity:.45;

}


.blur-1{

    width:500px;
    height:500px;

    background:#ffe287;

    top:-150px;
    left:-120px;

}


.blur-2{

    width:600px;
    height:600px;

    background:#dfeeff;

    right:-220px;
    bottom:-180px;

}


/* ========================================================== */

.grid-bg{

    position:absolute;

    inset:0;

    background-image:

        linear-gradient(rgba(0,0,0,.03) 1px,transparent 1px),
        linear-gradient(90deg,rgba(0,0,0,.03) 1px,transparent 1px);

    background-size:60px 60px;

    opacity:.4;

}


/* ========================================================== */

.calc-section .container{

    position:relative;

    z-index:5;

    max-width:1500px;

}


/* ========================================================== */

.calc-header{

    max-width:760px;

    margin:0 auto 70px;

    text-align:center;

}


/* ========================================================== */

.calc-badge{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:12px 22px;

    border-radius:100px;

    background:white;

    border:1px solid var(--calc-border);

    font-size:14px;

    font-weight:700;

    color:var(--calc-text);

    box-shadow:var(--calc-shadow);

    margin-bottom:24px;

}


/* ========================================================== */

.calc-badge span{

    width:10px;
    height:10px;

    border-radius:50%;

    background:var(--calc-yellow);

    animation:pulseBadge 2s infinite;

}


/* ========================================================== */

@keyframes pulseBadge{

    0%{

        box-shadow:0 0 0 0 rgba(253,185,19,.55);

    }

    70%{

        box-shadow:0 0 0 10px rgba(253,185,19,0);

    }

    100%{

        box-shadow:0 0 0 0 rgba(253,185,19,0);

    }

}


/* ========================================================== */

.calc-header h2{

    font-size:56px;

    line-height:1.1;

    color:var(--calc-dark);

    font-weight:800;

    margin-bottom:26px;

}


/* ========================================================== */

.calc-header p{

    font-size:20px;

    line-height:1.8;

    color:var(--calc-text-light);

}


/* ========================================================== */

.calc-progress{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:22px;

    margin-bottom:70px;

}


/* ========================================================== */

.calc-progress .line{

    width:90px;

    height:2px;

    background:#dfe3ea;

}


/* ========================================================== */

.step{

    display:flex;

    flex-direction:column;

    align-items:center;

    gap:12px;

}


/* ========================================================== */

.step .number{

    width:58px;
    height:58px;

    border-radius:50%;

    background:white;

    border:2px solid var(--calc-border);

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:20px;

    font-weight:700;

    color:var(--calc-text);

    transition:var(--transition);

    box-shadow:var(--calc-shadow);

}


/* ========================================================== */

.step.active .number{

    background:var(--calc-yellow);

    border-color:var(--calc-yellow);

    color:#111;

}


/* ========================================================== */

.step span{

    font-size:15px;

    color:var(--calc-text-light);

    font-weight:600;

}


/* ========================================================== */

.calc-layout{

    display:grid;

    grid-template-columns:

        minmax(0,1fr)
        380px;

    gap:34px;

    align-items:start;

}


/* ========================================================== */

.calc-main{

    min-width:0;

}


/* ========================================================== */

.calc-sidebar{

    position:sticky;

    top:110px;

}
/* ==========================================================
   CATEGORY SEARCH
========================================================== */

.calc-search{

    position:relative;

    margin-bottom:34px;

}

.calc-search svg{

    position:absolute;

    left:22px;
    top:50%;

    transform:translateY(-50%);

    width:22px;
    height:22px;

    stroke:#8b96a8;
    stroke-width:2;
    fill:none;

    pointer-events:none;

}

.calc-search input{

    width:100%;
    height:68px;

    padding:0 24px 0 62px;

    border:none;
    outline:none;

    border-radius:22px;

    background:#fff;

    box-shadow:var(--calc-shadow);

    border:1px solid var(--calc-border);

    font-size:17px;

    transition:var(--transition);

}

.calc-search input:focus{

    border-color:var(--calc-yellow);

    box-shadow:
        0 0 0 5px rgba(253,185,19,.12),
        var(--calc-shadow);

}


/* ==========================================================
   GRID
========================================================== */

.category-grid{

    display:grid;

    grid-template-columns:repeat(auto-fill,minmax(320px,1fr));

    gap:28px;

}


/* ==========================================================
   CARD
========================================================== */

.category-card{

    position:relative;

    overflow:hidden;

    border-radius:28px;

    background:#fff;

    box-shadow:var(--calc-shadow);

    transition:var(--transition);

    cursor:pointer;

    border:1px solid rgba(255,255,255,.4);

}

.category-card:hover{

    transform:translateY(-10px);

    box-shadow:var(--calc-shadow-hover);

}


/* ==========================================================
   IMAGE
========================================================== */

.card-image{

    position:relative;

    height:220px;

    overflow:hidden;

}

.card-image img{

    width:100%;
    height:100%;

    object-fit:cover;

    transition:1s;

}

.category-card:hover .card-image img{

    transform:scale(1.08);

}


/* ==========================================================
   OVERLAY
========================================================== */

.overlay{

    position:absolute;

    inset:0;

    background:

        linear-gradient(
            to top,
            rgba(0,0,0,.65),
            rgba(0,0,0,.08)
        );

}


/* ==========================================================
   CONTENT
========================================================== */

.card-content{

    position:relative;

    margin-top:-52px;

    background:#fff;

    border-radius:28px 28px 0 0;

    padding:26px;

    z-index:2;

}


/* ==========================================================
   ICON
========================================================== */

.card-content .icon{

    width:68px;
    height:68px;

    border-radius:22px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:linear-gradient(
        135deg,
        #ffe48c,
        #FDB913
    );

    font-size:30px;

    box-shadow:

        0 14px 35px rgba(253,185,19,.35);

    margin-bottom:20px;

}


/* ==========================================================
   TITLE
========================================================== */

.card-content h3{

    font-size:28px;

    color:var(--calc-dark);

    margin-bottom:14px;

    font-weight:800;

}


/* ==========================================================
   TEXT
========================================================== */

.card-content p{

    color:var(--calc-text-light);

    line-height:1.75;

    min-height:82px;

    margin-bottom:26px;

}


/* ==========================================================
   FOOTER
========================================================== */

.bottom{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:16px;

}

.bottom span{

    color:#7d8795;

    font-weight:700;

    font-size:15px;

}


/* ==========================================================
   BUTTON
========================================================== */

.bottom button{

    border:none;

    background:linear-gradient(
        135deg,
        var(--calc-yellow),
        #ffcf40
    );

    color:#111;

    font-weight:700;

    font-size:15px;

    padding:14px 22px;

    border-radius:16px;

    cursor:pointer;

    transition:var(--transition);

}

.bottom button:hover{

    transform:translateY(-3px);

    box-shadow:

        0 14px 30px rgba(253,185,19,.35);

}


/* ==========================================================
   HOVER LIGHT
========================================================== */

.category-card::before{

    content:"";

    position:absolute;

    top:-120px;
    left:-120px;

    width:240px;
    height:240px;

    border-radius:50%;

    background:

        radial-gradient(
            rgba(255,255,255,.35),
            transparent 70%
        );

    opacity:0;

    transition:.7s;

    z-index:3;

}

.category-card:hover::before{

    opacity:1;

    transform:scale(1.4);

}


/* ==========================================================
   ACTIVE
========================================================== */

.category-card.active{

    border:2px solid var(--calc-yellow);

    box-shadow:

        0 0 0 6px rgba(253,185,19,.12),
        var(--calc-shadow-hover);

}
/* ==========================================================
   SIDEBAR
========================================================== */

.summary-card{

    position:relative;

    overflow:hidden;

    background:rgba(255,255,255,.82);

    backdrop-filter:blur(24px);

    -webkit-backdrop-filter:blur(24px);

    border:1px solid rgba(255,255,255,.7);

    border-radius:30px;

    padding:30px;

    box-shadow:
        0 25px 70px rgba(20,25,40,.12);

}


/* ========================================================== */

.summary-card::before{

    content:"";

    position:absolute;

    top:-160px;
    right:-140px;

    width:320px;
    height:320px;

    border-radius:50%;

    background:
        radial-gradient(circle,
        rgba(253,185,19,.22),
        transparent 72%);

    pointer-events:none;

}


/* ========================================================== */

.summary-head{

    display:flex;

    justify-content:space-between;

    align-items:flex-start;

    margin-bottom:28px;

}

.mini-title{

    display:inline-block;

    font-size:12px;

    text-transform:uppercase;

    letter-spacing:2px;

    color:#9aa4b3;

    margin-bottom:6px;

}

.summary-head h3{

    font-size:34px;

    color:var(--calc-dark);

    line-height:1.15;

    font-weight:800;

}

.summary-status{

    width:62px;
    height:62px;

    border-radius:18px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:linear-gradient(
        135deg,
        var(--calc-yellow),
        #ffd75f
    );

    color:#111;

    font-weight:800;

    font-size:18px;

}


/* ========================================================== */

.summary-progress{

    margin-bottom:26px;

}

.progress-line{

    height:12px;

    border-radius:100px;

    background:#edf1f6;

    overflow:hidden;

}

.progress-line span{

    display:block;

    width:0;

    height:100%;

    border-radius:100px;

    background:linear-gradient(
        90deg,
        var(--calc-yellow),
        #ffd961
    );

    transition:.5s;

}


/* ========================================================== */

.summary-info{

    color:#6f7988;

    line-height:1.7;

    margin-bottom:34px;

}


/* ==========================================================
   SELECTED BLOCK
========================================================== */

.selected-block{

    margin-bottom:34px;

}

.selected-block h4{

    font-size:18px;

    font-weight:700;

    color:var(--calc-dark);

    margin-bottom:18px;

}


/* ========================================================== */

.selected-categories{

    display:flex;

    flex-direction:column;

    gap:14px;

}


/* ========================================================== */

.empty-state{

    padding:30px;

    border:2px dashed #dde4ec;

    border-radius:22px;

    text-align:center;

}

.empty-state svg{

    width:34px;
    height:34px;

    margin-bottom:12px;

    stroke:#b3bcc9;

    stroke-width:2;

    fill:none;

}

.empty-state span{

    display:block;

    color:#96a0af;

}


/* ==========================================================
   PRICE CARD
========================================================== */

.price-card{

    position:relative;

    overflow:hidden;

    padding:28px;

    border-radius:24px;

    margin-bottom:30px;

    color:white;

    background:
        linear-gradient(
            145deg,
            #1b1b1b,
            #343434
        );

}

.price-card::after{

    content:"";

    position:absolute;

    top:-80px;
    right:-80px;

    width:180px;
    height:180px;

    border-radius:50%;

    background:
        radial-gradient(
            rgba(253,185,19,.35),
            transparent 70%
        );

}

.price-card span{

    display:block;

    color:rgba(255,255,255,.75);

    margin-bottom:12px;

    font-size:14px;

}

.price{

    font-size:46px;

    font-weight:800;

    margin-bottom:14px;

    line-height:1;

}

.price-card small{

    display:block;

    color:rgba(255,255,255,.65);

    line-height:1.65;

}


/* ==========================================================
   BUTTONS
========================================================== */

.summary-buttons{

    display:flex;

    flex-direction:column;

    gap:16px;

    margin-bottom:34px;

}

.btn-outline,
.btn-primary{

    width:100%;

    height:60px;

    border-radius:18px;

    font-size:16px;

    font-weight:700;

    transition:var(--transition);

    cursor:pointer;

}


/* ========================================================== */

.btn-outline{

    display:flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    border:2px solid var(--calc-border);

    background:white;

    color:var(--calc-dark);

}

.btn-outline svg{

    width:18px;
    height:18px;

    stroke:currentColor;

    stroke-width:2;

    fill:none;

}

.btn-outline:hover{

    transform:translateY(-3px);

    border-color:var(--calc-yellow);

}


/* ========================================================== */

.btn-primary{

    border:none;

    color:#111;

    background:

        linear-gradient(
            135deg,
            var(--calc-yellow),
            #ffd54b
        );

    box-shadow:

        0 15px 35px rgba(253,185,19,.28);

}

.btn-primary:hover{

    transform:translateY(-4px);

    box-shadow:

        0 22px 45px rgba(253,185,19,.4);

}


/* ==========================================================
   ADVANTAGES
========================================================== */

.advantages{

    display:flex;

    flex-direction:column;

    gap:16px;

}

.advantage{

    display:flex;

    align-items:center;

    gap:14px;

}

.advantage .icon{

    width:38px;
    height:38px;

    border-radius:12px;

    display:flex;

    align-items:center;
    justify-content:center;

    background:#fff7df;

    color:#c58b00;

    font-weight:700;

}

.advantage span{

    color:#5f6977;

    font-weight:600;

}
/* ==========================================================
   SERVICE MODAL
========================================================== */

.service-modal{

    position:fixed;

    inset:0;

    display:flex;

    align-items:center;

    justify-content:center;

    opacity:0;

    visibility:hidden;

    transition:.35s;

    z-index:9999;

}

.service-modal.active{

    opacity:1;

    visibility:visible;

}


/* ========================================================== */

.modal-backdrop{

    position:absolute;

    inset:0;

    background:rgba(15,20,28,.65);

    backdrop-filter:blur(10px);

}


/* ========================================================== */

.modal-window{

    position:relative;

    width:min(980px,92vw);

    max-height:88vh;

    overflow:hidden;

    display:flex;

    flex-direction:column;

    background:#fff;

    border-radius:30px;

    box-shadow:

        0 35px 90px rgba(0,0,0,.25);

    transform:translateY(40px) scale(.95);

    opacity:0;

    transition:.4s cubic-bezier(.2,.8,.2,1);

}

.service-modal.active .modal-window{

    opacity:1;

    transform:none;

}


/* ==========================================================
   HEADER
========================================================== */

.modal-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:30px;

    border-bottom:1px solid var(--calc-border);

}

.modal-title{

    display:flex;

    align-items:center;

    gap:20px;

}

.modal-icon{

    width:70px;
    height:70px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:22px;

    font-size:34px;

    background:linear-gradient(
        135deg,
        #ffe48b,
        var(--calc-yellow)
    );

}

.modal-title h2{

    margin:0;

    font-size:30px;

    color:var(--calc-dark);

}

.modal-title p{

    margin-top:6px;

    color:#7d8795;

}


/* ========================================================== */

.modal-close{

    width:52px;
    height:52px;

    border:none;

    background:#f4f6f9;

    border-radius:16px;

    cursor:pointer;

    font-size:22px;

    transition:var(--transition);

}

.modal-close:hover{

    background:#171717;

    color:#fff;

}


/* ==========================================================
   SEARCH
========================================================== */

.modal-search{

    position:relative;

    padding:26px 30px;

}

.modal-search svg{

    position:absolute;

    top:50%;

    left:52px;

    width:20px;
    height:20px;

    transform:translateY(-50%);

    stroke:#8a95a6;

    stroke-width:2;

    fill:none;

}

.modal-search input{

    width:100%;

    height:60px;

    border:none;

    outline:none;

    border-radius:18px;

    background:#f7f9fc;

    padding-left:56px;

    padding-right:20px;

    font-size:16px;

    border:1px solid transparent;

    transition:var(--transition);

}

.modal-search input:focus{

    border-color:var(--calc-yellow);

    background:#fff;

}


/* ==========================================================
   LIST
========================================================== */

.modal-services{

    flex:1;

    overflow:auto;

    padding:0 30px 30px;

}


/* ========================================================== */

.modal-services::-webkit-scrollbar{

    width:10px;

}

.modal-services::-webkit-scrollbar-thumb{

    background:#d6dce5;

    border-radius:100px;

}


/* ==========================================================
   ITEM
========================================================== */

.service-item{

    display:grid;

    grid-template-columns:26px 1fr auto;

    gap:20px;

    align-items:center;

    padding:22px;

    margin-bottom:18px;

    border-radius:22px;

    border:1px solid var(--calc-border);

    background:#fff;

    cursor:pointer;

    transition:var(--transition);

}

.service-item:hover{

    transform:translateY(-3px);

    border-color:var(--calc-yellow);

    box-shadow:0 18px 35px rgba(0,0,0,.08);

}


/* ==========================================================
   CHECKBOX
========================================================== */

.service-item input{

    width:22px;
    height:22px;

    accent-color:var(--calc-yellow);

    cursor:pointer;

}


/* ==========================================================
   TEXT
========================================================== */

.service-info h4{

    margin:0 0 8px;

    font-size:19px;

    color:var(--calc-dark);

}

.service-info p{

    margin:0;

    color:#7c8695;

    line-height:1.6;

}


/* ==========================================================
   PRICE
========================================================== */

.service-price{

    font-size:22px;

    font-weight:800;

    color:var(--calc-yellow-dark);

    white-space:nowrap;

}


/* ==========================================================
   FOOTER
========================================================== */

.modal-footer{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    padding:26px 30px;

    border-top:1px solid var(--calc-border);

    background:#fbfcfe;

}

.selected-counter{

    font-size:16px;

    color:#6c7787;

}

.selected-counter strong{

    color:var(--calc-dark);

    margin-left:8px;

}

.modal-buttons{

    display:flex;

    gap:16px;

}

.btn-light{

    border:none;

    background:#edf2f7;

    color:#4d5968;

    padding:0 28px;

    height:56px;

    border-radius:16px;

    cursor:pointer;

    font-weight:700;

    transition:var(--transition);

}

.btn-light:hover{

    background:#dfe6ef;

}
/* ==========================================================
   REQUEST MODAL
========================================================== */

.request-modal{

    position:fixed;

    inset:0;

    display:flex;

    align-items:center;

    justify-content:center;

    opacity:0;

    visibility:hidden;

    transition:.35s;

    z-index:10000;

}

.request-modal.active{

    opacity:1;

    visibility:visible;

}

.request-overlay{

    position:absolute;

    inset:0;

    background:rgba(15,20,30,.68);

    backdrop-filter:blur(10px);

}

.request-window{

    position:relative;

    width:min(760px,92vw);

    max-height:90vh;

    overflow:auto;

    background:#fff;

    border-radius:32px;

    box-shadow:0 40px 100px rgba(0,0,0,.22);

    padding:40px;

    transform:translateY(40px) scale(.96);

    opacity:0;

    transition:.4s cubic-bezier(.2,.8,.2,1);

}

.request-modal.active .request-window{

    transform:none;

    opacity:1;

}

.request-window::-webkit-scrollbar{

    width:10px;

}

.request-window::-webkit-scrollbar-thumb{

    background:#d8dee8;

    border-radius:100px;

}

/* ========================================================== */

.request-close{

    position:absolute;

    top:24px;

    right:24px;

    width:52px;

    height:52px;

    border:none;

    border-radius:16px;

    background:#f4f6f9;

    font-size:24px;

    cursor:pointer;

    transition:var(--transition);

}

.request-close:hover{

    background:#171717;

    color:#fff;

}

/* ========================================================== */

.request-header{

    text-align:center;

    margin-bottom:34px;

}

.request-badge{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:10px 18px;

    border-radius:100px;

    background:#fff6d8;

    color:#b88200;

    font-size:13px;

    font-weight:700;

    margin-bottom:20px;

}

.request-header h2{

    font-size:38px;

    color:var(--calc-dark);

    margin-bottom:16px;

}

.request-header p{

    max-width:520px;

    margin:auto;

    line-height:1.7;

    color:#6d7787;

}

/* ==========================================================
   FORM
========================================================== */

.request-form{

    display:flex;

    flex-direction:column;

    gap:22px;

}

.form-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:20px;

}

.form-group{

    display:flex;

    flex-direction:column;

}

.form-group label{

    margin-bottom:10px;

    font-weight:700;

    color:#414958;

}

.form-group input,
.form-group textarea{

    border:none;

    outline:none;

    background:#f7f9fc;

    border:1px solid transparent;

    border-radius:18px;

    padding:18px 20px;

    font-size:16px;

    transition:var(--transition);

    resize:vertical;

}

.form-group textarea{

    min-height:150px;

}

.form-group input:focus,
.form-group textarea:focus{

    background:#fff;

    border-color:var(--calc-yellow);

    box-shadow:0 0 0 5px rgba(253,185,19,.12);

}

/* ==========================================================
   UPLOAD
========================================================== */

.upload-area{

    position:relative;

    border:2px dashed #d8dfe8;

    border-radius:24px;

    padding:42px;

    text-align:center;

    cursor:pointer;

    transition:var(--transition);

}

.upload-area:hover{

    border-color:var(--calc-yellow);

    background:#fffdf4;

}

.upload-area svg{

    width:46px;

    height:46px;

    stroke:var(--calc-yellow);

    stroke-width:2;

    fill:none;

    margin-bottom:18px;

}

.upload-area strong{

    display:block;

    font-size:19px;

    margin-bottom:8px;

    color:var(--calc-dark);

}

.upload-area span{

    display:block;

    color:#7b8593;

}

.upload-area input{

    position:absolute;

    inset:0;

    opacity:0;

    cursor:pointer;

}

/* ========================================================== */

.agree{

    display:flex;

    align-items:flex-start;

    gap:14px;

    cursor:pointer;

    color:#6c7584;

    line-height:1.6;

}

.agree input{

    margin-top:4px;

    accent-color:var(--calc-yellow);

}

.submit-request{

    margin-top:8px;

    height:64px;

    font-size:18px;

}

/* ==========================================================
   TOAST
========================================================== */

.toast-container{

    position:fixed;

    top:30px;

    right:30px;

    z-index:11000;

    pointer-events:none;

}

.toast{

    min-width:330px;

    display:flex;

    align-items:center;

    gap:18px;

    padding:20px 24px;

    border-radius:22px;

    background:#fff;

    box-shadow:0 22px 50px rgba(0,0,0,.14);

    transform:translateX(120%);

    transition:.45s;

}

.toast.show{

    transform:none;

}

.toast-icon{

    width:52px;

    height:52px;

    border-radius:16px;

    background:#e9fff0;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#1ea956;

    font-size:22px;

    font-weight:800;

}

.toast-content strong{

    display:block;

    margin-bottom:6px;

    color:#171717;

}

.toast-content span{

    color:#727d8d;

}

/* ==========================================================
   LOADER
========================================================== */

.calc-loader{

    position:fixed;

    inset:0;

    display:flex;

    align-items:center;

    justify-content:center;

    background:rgba(255,255,255,.82);

    backdrop-filter:blur(8px);

    opacity:0;

    visibility:hidden;

    transition:.3s;

    z-index:12000;

}

.calc-loader.active{

    opacity:1;

    visibility:visible;

}

.loader-box{

    text-align:center;

}

.loader-circle{

    width:82px;

    height:82px;

    margin:0 auto 26px;

    border-radius:50%;

    border:6px solid #eceff4;

    border-top-color:var(--calc-yellow);

    animation:calcSpin .9s linear infinite;

}

@keyframes calcSpin{

    to{

        transform:rotate(360deg);

    }

}

.loader-box h3{

    font-size:30px;

    margin-bottom:12px;

    color:#171717;

}

.loader-box p{

    color:#768090;

}

/* ==========================================================
   SUCCESS
========================================================== */

.success-modal{

    position:fixed;

    inset:0;

    display:flex;

    align-items:center;

    justify-content:center;

    opacity:0;

    visibility:hidden;

    background:rgba(18,22,30,.72);

    backdrop-filter:blur(8px);

    transition:.35s;

    z-index:13000;

}

.success-modal.active{

    opacity:1;

    visibility:visible;

}

.success-window{

    width:min(520px,90vw);

    background:#fff;

    border-radius:30px;

    padding:50px;

    text-align:center;

    box-shadow:0 35px 90px rgba(0,0,0,.22);

}

.success-icon{

    width:90px;

    height:90px;

    margin:0 auto 26px;

    border-radius:28px;

    background:linear-gradient(135deg,#29d66f,#1ea956);

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:40px;

    font-weight:800;

}

.success-window h2{

    font-size:36px;

    margin-bottom:16px;

}

.success-window p{

    color:#6f7988;

    line-height:1.8;

    margin-bottom:34px;

}
/* ==========================================================
   MOBILE SUMMARY
========================================================== */

.mobile-summary{

    position:fixed;

    left:20px;
    right:20px;
    bottom:20px;

    display:none;

    align-items:center;

    justify-content:space-between;

    gap:20px;

    padding:18px 22px;

    background:rgba(255,255,255,.94);

    backdrop-filter:blur(20px);

    -webkit-backdrop-filter:blur(20px);

    border-radius:22px;

    box-shadow:

        0 20px 60px rgba(0,0,0,.15);

    z-index:999;

}

.mobile-price{

    display:flex;

    flex-direction:column;

}

.mobile-price small{

    color:#8b95a4;

    font-size:13px;

    margin-bottom:4px;

}

.mobile-price strong{

    font-size:28px;

    color:var(--calc-dark);

}

/* ==========================================================
   SCROLLBAR
========================================================== */

.calc-section *::-webkit-scrollbar{

    width:10px;

    height:10px;

}

.calc-section *::-webkit-scrollbar-thumb{

    background:#d6dde7;

    border-radius:100px;

}

.calc-section *::-webkit-scrollbar-track{

    background:transparent;

}

/* ==========================================================
   ANIMATIONS
========================================================== */

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:none;

    }

}

.calc-header{

    animation:fadeUp .7s ease;

}

.calc-progress{

    animation:fadeUp .8s ease;

}

.category-card{

    animation:fadeUp .9s ease;

}

/* ==========================================================
   TABLET
========================================================== */

@media (max-width:1200px){

    .calc-layout{

        grid-template-columns:1fr;

    }

    .calc-sidebar{

        position:relative;

        top:auto;

        order:-1;

    }

    .summary-card{

        margin-bottom:40px;

    }

}

/* ==========================================================
   SMALL TABLET
========================================================== */

@media (max-width:900px){

    .calc-header h2{

        font-size:42px;

    }

    .calc-header p{

        font-size:18px;

    }

    .category-grid{

        grid-template-columns:repeat(2,minmax(0,1fr));

    }

    .modal-window{

        width:95vw;

    }

    .modal-footer{

        flex-direction:column;

        align-items:stretch;

    }

    .modal-buttons{

        width:100%;

    }

    .modal-buttons button{

        flex:1;

    }

    .form-grid{

        grid-template-columns:1fr;

    }

}

/* ==========================================================
   MOBILE
========================================================== */

@media (max-width:768px){

    .calc-section{

        padding:70px 0 110px;

    }

    .calc-header{

        margin-bottom:50px;

    }

    .calc-header h2{

        font-size:34px;

    }

    .calc-header p{

        font-size:16px;

        line-height:1.7;

    }

    .calc-progress{

        gap:10px;

    }

    .calc-progress .line{

        width:36px;

    }

    .step .number{

        width:46px;
        height:46px;

        font-size:16px;

    }

    .step span{

        font-size:12px;

        text-align:center;

    }

    .category-grid{

        grid-template-columns:1fr;

    }

    .card-image{

        height:210px;

    }

    .card-content{

        padding:22px;

    }

    .card-content h3{

        font-size:24px;

    }

    .price{

        font-size:38px;

    }

    .request-window{

        padding:28px;

    }

    .request-header h2{

        font-size:30px;

    }

    .modal-header{

        padding:22px;

    }

    .modal-search{

        padding:20px 22px;

    }

    .modal-services{

        padding:0 22px 22px;

    }

    .service-item{

        grid-template-columns:22px 1fr;

    }

    .service-price{

        grid-column:2;

        margin-top:8px;

        font-size:18px;

    }

    .mobile-summary{

        display:flex;

    }

}

/* ==========================================================
   SMALL MOBILE
========================================================== */

@media (max-width:480px){

    .calc-header h2{

        font-size:28px;

    }

    .summary-card{

        padding:22px;

    }

    .price{

        font-size:34px;

    }

    .btn-primary,
    .btn-outline{

        height:56px;

        font-size:15px;

    }

    .toast{

        min-width:auto;

        width:calc(100vw - 30px);

    }

    .success-window{

        padding:35px 24px;

    }

    .success-window h2{

        font-size:28px;

    }

}

/* ==========================================================
   REDUCED MOTION
========================================================== */

@media (prefers-reduced-motion:reduce){

    *{

        animation:none !important;

        transition:none !important;

        scroll-behavior:auto !important;

    }

}
/* ============================================================
   Стили для выбранных услуг в сайдбаре
   ============================================================ */
.selected-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    background: #fff;
    border-radius: 16px;
    border: 1px solid var(--calc-border);
    box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    transition: var(--transition);
}
.selected-item:hover {
    border-color: var(--calc-yellow);
    box-shadow: 0 4px 16px rgba(253,185,19,0.08);
}
.selected-item div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.selected-item strong {
    font-size: 16px;
    color: var(--calc-dark);
}
.selected-item small {
    font-size: 13px;
    color: var(--calc-text-light);
}
.selected-item .remove-item {
    background: none;
    border: none;
    font-size: 18px;
    color: #b3bcc9;
    cursor: pointer;
    transition: var(--transition);
    padding: 0 4px;
    line-height: 1;
}
.selected-item .remove-item:hover {
    color: #e74c3c;
    transform: scale(1.2);
}
/* ============================================================
   TOAST (уведомления)
   ============================================================ */
.toast {
    
    background: #ffffff;
    color: #171717;
    border-radius: 22px;
    box-shadow: 0 22px 50px rgba(0, 0, 0, 0.14);
    font-size: 16px;
    font-weight: 600;
    
}
.toast.error {
    background: #fee;
    color: #b91c1c;
    border: 1px solid #fecaca;
}
.toast.success {
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}