body[data-page="home"] {
  background: radial-gradient(circle at top left, rgba(124, 255, 196, 0.06), transparent 55%), radial-gradient(circle at bottom right, rgba(179, 136, 255, 0.09), transparent 55%), var(--color-bg);
}
.hero-home {
  position: relative;
}
.hero-home::before {
  background-image: url("/src/media/hero-banner.webp");
}
.hero-overlay-gradient {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(25, 7, 70, 0.9), rgba(5, 3, 15, 0.95));
  mix-blend-mode: multiply;
  pointer-events: none;
}
.hero-panel-animated {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity var(--transition-slow), transform var(--transition-slow);
}
.hero-panel-animated.is-visible {
  opacity: 1;
  transform: translateY(0);
}
[data-hero-stagger] {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity var(--transition-slow), transform var(--transition-slow);
}
[data-hero-stagger].is-visible {
  opacity: 1;
  transform: translateY(0);
}
.hero-tagline {
  font-size: var(--text-sm);
  color: var(--color-text-soft);
  max-width: 40rem;
}
.hero-visual-home {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}
.hero-visual-facts {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-md);
}
.hero-fact {
  padding: 0.6rem 0.9rem;
  border-radius: var(--radius-pill);
  background: radial-gradient(circle at top left, rgba(124, 255, 196, 0.18), transparent 55%), rgba(5, 3, 20, 0.9);
  border: 1px solid rgba(124, 255, 196, 0.4);
  box-shadow: 0 0 14px rgba(124, 255, 196, 0.4);
}
.hero-fact-label {
  font-size: var(--text-2xs);
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: var(--color-text-muted);
}
.hero-fact-value {
  font-size: var(--text-xs);
  color: var(--color-text);
}
.section-header {
  max-width: 52rem;
  margin-bottom: var(--space-2xl);
}
.section-header-center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.section-header-center .section-subtitle {
  margin-left: auto;
  margin-right: auto;
}
.section-subtitle {
  font-size: var(--text-md);
  color: var(--color-text-soft);
}
.section-about {
  background: radial-gradient(circle at top left, rgba(124, 255, 196, 0.05), transparent 55%), radial-gradient(circle at bottom right, rgba(179, 136, 255, 0.08), transparent 55%), var(--color-bg);
}
.about-highlight-panel {
  display: flex;
  align-items: stretch;
}
.about-card {
  height: 100%;
}
.about-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-md);
  margin-top: var(--space-lg);
}
.about-list-item {
  display: flex;
  gap: var(--space-md);
  align-items: flex-start;
}
.about-bullet {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  border-radius: 999px;
  background: radial-gradient(circle, #7cffc4 0, #5ef2ff 40%, #b388ff 80%);
  box-shadow: 0 0 16px rgba(124, 255, 196, 0.8);
}
.about-list-content {
  flex: 1 1 auto;
  min-width: 0;
}
.about-list-title {
  font-size: var(--text-md);
  margin-bottom: 0.15rem;
}
.about-list-text {
  font-size: var(--text-sm);
  color: var(--color-text-soft);
}
.section-inspiration {
  background: radial-gradient(circle at top right, rgba(94, 242, 255, 0.08), transparent 55%), var(--color-bg-soft);
}
.inspiration-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.2fr);
  gap: var(--grid-gap-xl);
  align-items: center;
}
.inspiration-media-frame {
  border-radius: var(--radius-panel);
  overflow: hidden;
  background: radial-gradient(circle at top left, rgba(124, 255, 196, 0.16), transparent 55%), rgba(5, 3, 20, 0.95);
  border: 1px solid rgba(124, 255, 196, 0.4);
  box-shadow: var(--shadow-soft), var(--shadow-glow-primary);
}
.inspiration-content {
  min-width: 0;
}
.inspiration-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--space-md);
  margin-bottom: var(--space-xl);
}
.inspiration-item {
  display: flex;
  gap: var(--space-md);
}
.inspiration-icon {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  border: 1px solid rgba(124, 255, 196, 0.6);
  box-shadow: 0 0 14px rgba(124, 255, 196, 0.6);
  background: radial-gradient(circle, rgba(124, 255, 196, 0.9), rgba(94, 242, 255, 0.9));
}
.inspiration-text {
  flex: 1 1 auto;
  min-width: 0;
}
.inspiration-title {
  font-size: var(--text-md);
  margin-bottom: 0.15rem;
}
.inspiration-item p {
  font-size: var(--text-sm);
  color: var(--color-text-soft);
}
.inspiration-cta {
  justify-content: flex-start;
}
.section-shortcuts {
  background: radial-gradient(circle at bottom left, rgba(124, 255, 196, 0.06), transparent 55%), var(--color-bg);
}
.shortcuts-grid {
  margin-top: var(--space-xl);
}
.shortcut-card .card-body {
  font-size: var(--text-sm);
  color: var(--color-text-soft);
}
.section-gallery {
  background: radial-gradient(circle at top left, rgba(179, 136, 255, 0.12), transparent 55%), var(--color-bg-soft);
}
.gallery-slider {
  position: relative;
  border-radius: var(--radius-panel);
  padding: var(--space-lg);
  background: radial-gradient(circle at top left, rgba(124, 255, 196, 0.14), transparent 55%), radial-gradient(circle at bottom right, rgba(179, 136, 255, 0.18), transparent 55%), var(--color-surface-glass-strong);
  border: 1px solid var(--color-border-strong);
  box-shadow: var(--shadow-soft), var(--shadow-glow-primary);
  overflow: hidden;
}
.gallery-track {
  display: flex;
  transition: transform 500ms ease;
  will-change: transform;
}
.gallery-slide {
  min-width: 100%;
  padding-right: var(--space-md);
}
.gallery-slide:last-child {
  padding-right: 0;
}
.gallery-frame {
  margin: 0;
}
.gallery-media {
  position: relative;
  border-radius: var(--radius-card);
  overflow: hidden;
  background: rgba(5, 3, 20, 0.95);
  box-shadow: var(--shadow-soft);
}
.gallery-media img {
  width: 100%;
  height: auto;
  display: block;
}
.gallery-caption {
  margin-top: var(--space-md);
  font-size: var(--text-sm);
  color: var(--color-text-soft);
}
.gallery-controls {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
  margin-top: var(--space-lg);
}
.gallery-arrow {
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid rgba(124, 255, 196, 0.7);
  background: radial-gradient(circle at top left, rgba(124, 255, 196, 0.24), transparent 55%), rgba(5, 3, 20, 0.96);
  box-shadow: 0 0 14px rgba(124, 255, 196, 0.6);
  cursor: pointer;
  position: relative;
  flex-shrink: 0;
  transition: transform var(--transition-fast), box-shadow var(--transition-base), background var(--transition-base);
}
.gallery-arrow::before {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 12px;
  height: 12px;
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
}
.gallery-arrow-prev::before {
  transform: rotate(-135deg);
  margin-left: 14px;
}
.gallery-arrow-next::before {
  transform: rotate(45deg);
  margin-right: 14px;
}
.gallery-arrow:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-glow-accent);
}
.gallery-dots {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
}
.gallery-dot {
  width: 9px;
  height: 9px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.4);
  background: rgba(5, 3, 20, 0.9);
  cursor: pointer;
  transition: background var(--transition-base), transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}
.gallery-dot.is-active {
  background: radial-gradient(circle, #7cffc4 0, #5ef2ff 40%, #b388ff 80%);
  border-color: rgba(124, 255, 196, 0.9);
  box-shadow: 0 0 12px rgba(124, 255, 196, 0.8);
  transform: scale(1.1);
}
.gallery-cta-wrapper {
  margin-top: var(--space-2xl);
}
.gallery-cta {
  justify-content: center;
}
.section-contact-promo {
  background: radial-gradient(circle at bottom right, rgba(124, 255, 196, 0.08), transparent 55%), var(--color-bg);
}
.contact-promo-card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-lg);
}
.contact-promo-content {
  flex: 1 1 260px;
  min-width: 0;
}
.contact-promo-content p {
  font-size: var(--text-md);
  color: var(--color-text-soft);
}
.contact-promo-actions {
  flex: 0 0 auto;
}
.btn,
.btn-primary,
.btn-secondary,
.btn-ghost {
  max-width: 100%;
}
.nav-toggle {
  flex-direction: column;
}
@media (max-width: 1024px) {
  .inspiration-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .inspiration-media {
    order: -1;
  }
}
@media (max-width: 768px) {
  .hero-layout {
    gap: var(--space-xl);
  }
  .hero-visual-facts {
    gap: var(--space-sm);
  }
  .section-header {
    margin-bottom: var(--space-xl);
  }
  .gallery-slider {
    padding: var(--space-md);
  }
  .gallery-slide {
    padding-right: 0;
  }
  .gallery-controls {
    flex-wrap: wrap;
    justify-content: center;
  }
  .gallery-dots {
    width: 100%;
    justify-content: center;
    margin-left: 0;
  }
  .contact-promo-card {
    align-items: flex-start;
  }
  .contact-promo-actions {
    width: 100%;
    justify-content: flex-start;
  }
}
@media (max-width: 480px) {
  .hero-fact {
    width: 100%;
  }
  .gallery-slider {
    padding: var(--space-md);
  }
}
