:root {
  --color-primary: #0f172a;
  --color-secondary: #38bdf8;
  --color-accent: #f97316;
  --color-bg: #020617;
  --color-surface: #020617;
  --color-text: #e5e7eb;
  --radius-base: cut-corner;
  --layout-container-width: 1200px;
  --layout-gutter-x: 1.5rem;
  --font-main: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    sans-serif;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-main);
  background-color: var(--color-bg);
  color: var(--color-text);
}

/* Базовый контейнер, чтобы все страницы были визуально согласованы */
.site-container {
  max-width: var(--layout-container-width);
  margin-inline: auto;
  padding-inline: var(--layout-gutter-x);
}

/* Общие utility-классы, которые ИИ может использовать в Tailwind-окружении */
.site-card {
  border-radius: var(--radius-base);
  background-color: var(--color-surface);
}

/* Кнопки на всякий случай (если модель захочет использовать эти классы) */
.btn-primary-soft {
  border-radius: var(--radius-base);
  background: var(--color-primary);
  color: white;
}

.btn-primary-soft:hover {
  filter: brightness(1.05);
}

/* Минимальная адаптация шапки/футера, если модель захочет использовать */
.site-header,
.site-footer {
  backdrop-filter: blur(12px);
}
/* Custom Design Tokens */
:root {
  --color-cobalt: #1e3a8a;
  --color-pink: #ec4899;
}
body {
  font-family: "Inter", sans-serif;
  background-color: #0f172a;
  color: #ffffff;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Bebas Neue", sans-serif;
  letter-spacing: 0.05em;
}
.cut-corner {
  clip-path: polygon(0 0, 100% 0, 100% 85%, 92% 100%, 0 100%);
}
.cut-corner-btn {
  clip-path: polygon(0 0, 100% 0, 100% 70%, 90% 100%, 0 100%);
}
.text-shadow-glow {
  text-shadow: 0 0 20px rgba(236, 72, 153, 0.5);
}

.text-5xl {
  font-size: 26px !important;
}

.text-6xl {
  font-size: 32px !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.font-display {
  font-family: "Bebas Neue", sans-serif;
}
.clip-corner {
  clip-path: polygon(0 0, 100% 0, 100% 85%, 95% 100%, 0 100%);
}

.font-bebas {
  font-family: "Bebas Neue", sans-serif;
}
.font-sans {
  font-family: "Inter", sans-serif;
}

/* Custom Animation for Check Icon */
@keyframes scaleIn {
  0% {
    transform: scale(0);
    opacity: 0;
  }
  60% {
    transform: scale(1.1);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
.animate-scale-in {
  animation: scaleIn 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

/* Add this to your global CSS file or <style> tag in the head */

/* Burger menu lines transition */
[data-burger] svg line {
  transition: transform 0.3s ease, opacity 0.3s ease;
  transform-origin: center;
}

/* Open state: transform to cross */
[data-burger].open svg .line-top {
  transform: translateY(3px) rotate(45deg);
}

[data-burger].open svg .line-middle {
  opacity: 0;
}

[data-burger].open svg .line-bottom {
  transform: translateY(-5px) rotate(-45deg);
}

[data-mobile-nav] {
  z-index: -1 !important; /* Corrected from .data-mobile-nav and z-index -1 */
}