/* Nanoo Studio - Awwwards-style motion */

html.lenis,
html.lenis body {
  height: auto;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

html.js-ready:not(.is-animated):not(.reduced-motion) .hero-pending {
  opacity: 0;
}

html.js-ready:not(.is-animated):not(.reduced-motion) .nav-wrapper,
html.js-ready:not(.is-animated):not(.reduced-motion) .hero-founders img,
html.js-ready:not(.is-animated):not(.reduced-motion) .hero-trust,
html.js-ready:not(.is-animated):not(.reduced-motion) .hero-title .word,
html.js-ready:not(.is-animated):not(.reduced-motion) .hero-img-circle,
html.js-ready:not(.is-animated):not(.reduced-motion) .hero-subtitle,
html.js-ready:not(.is-animated):not(.reduced-motion) .hero-actions > * {
  opacity: 0;
}

html.js-ready:not(.is-animated):not(.reduced-motion) .hero-title .word {
  transform: translateY(1.15em);
  filter: blur(8px);
}

html.js-ready:not(.is-animated):not(.reduced-motion) .hero-subtitle {
  clip-path: inset(100% 0 0 0);
}

html.js-ready:not(.is-animated):not(.reduced-motion) .hero-bg {
  transform: scale(1.08);
  filter: blur(8px);
}

@media (max-width: 809px) {
  html.js-ready:not(.is-animated):not(.reduced-motion) .hero-title .word {
    filter: blur(4px);
  }

  html.js-ready:not(.is-animated):not(.reduced-motion) .hero-bg {
    filter: blur(4px);
  }
}

html.is-animated .hero-pending,
html.reduced-motion .hero-pending,
html.is-animated .hero-trust,
html.reduced-motion .hero-trust {
  opacity: 1;
}

html.is-animated .hero-trust,
html.reduced-motion .hero-trust {
  transform: none;
  filter: none;
}

/* Custom cursor */
.custom-cursor {
  pointer-events: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
}

.custom-cursor.is-hidden {
  opacity: 0;
}

.cursor-dot,
.cursor-ring {
  position: fixed;
  top: 0;
  left: 0;
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%);
  will-change: transform;
}

.cursor-dot {
  width: 8px;
  height: 8px;
  background: var(--accent);
}

.cursor-ring {
  width: 40px;
  height: 40px;
  border: 1.5px solid color-mix(in srgb, var(--accent) 55%, transparent);
}

.cursor-hover .cursor-ring {
  width: 56px;
  height: 56px;
  border-color: color-mix(in srgb, var(--accent) 85%, transparent);
}

/* Nav scroll states */
.nav-wrapper.is-scrolled .nav,
.nav-wrapper.is-scrolled.is-light .nav {
  background: rgba(12, 12, 12, 0.92) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);
}

.nav-wrapper.is-scrolled .nav-links a:not(.nav-contact),
.nav-wrapper.is-scrolled .mobile-menu-btn {
  color: var(--white) !important;
}

.nav-wrapper.is-scrolled .nav-contact {
  background: var(--white) !important;
  color: var(--dark) !important;
}

/* Header clair (option widget) */
.nav-wrapper.is-light .nav {
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.06);
}

.nav-wrapper.is-light .nav-links a:not(.nav-contact),
.nav-wrapper.is-light .mobile-menu-btn {
  color: var(--dark) !important;
}

.nav-wrapper.is-light .nav-links {
  background: rgba(0, 0, 0, 0.04);
}

.nav-wrapper.is-light .nav-links a:not(.nav-contact):hover {
  background: rgba(0, 0, 0, 0.06);
}

.nav-wrapper.is-hidden {
  transform: translateY(-120%);
}

.nav-wrapper {
  transition: transform 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.nav-links a.is-active {
  background: color-mix(in srgb, var(--accent) 20%, transparent);
  color: #fff;
}

.nav-links a:not(.nav-contact) {
  position: relative;
}

.nav-links a:not(.nav-contact)::after {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 8px;
  height: 2px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.nav-links a:not(.nav-contact):hover::after,
.nav-links a:not(.nav-contact).is-active::after {
  transform: scaleX(1);
}

/* Process timeline */
.process-timeline-progress {
  will-change: transform;
}

html.reduced-motion .process-timeline-progress {
  transform: scaleY(1);
}

html.reduced-motion .process-step-marker {
  transform: scale(1);
}

/* Section accents */
.section-label-accent {
  display: block;
  width: 48px;
  height: 2px;
  background: var(--accent);
  margin-top: 8px;
  transform-origin: left center;
}

.tools-section .section-label {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.services-nanoo .section-label,
.projects-section .section-label {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.tools-section .section-label-accent {
  margin-left: auto;
  margin-right: auto;
  transform-origin: center center;
}

/* 3D tilt */
.tilt-card {
  transform-style: preserve-3d;
  will-change: transform;
}

.services-cards {
  perspective: 1200px;
}

.project-image img {
  will-change: transform;
}

/* Reduced motion */
html.reduced-motion *,
html.reduced-motion *::before,
html.reduced-motion *::after {
  animation-duration: 0.01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.01ms !important;
}

@media (max-width: 809px), (hover: none) {
  .custom-cursor {
    display: none !important;
  }
}

body.nanoo-no-cursor .custom-cursor {
  display: none !important;
}

body.nanoo-no-cursor,
body.nanoo-no-cursor a,
body.nanoo-no-cursor button {
  cursor: auto !important;
}

body.elementor-editor-active .custom-cursor {
  display: none !important;
}

body.elementor-editor-active,
body.elementor-editor-active a,
body.elementor-editor-active button {
  cursor: auto !important;
}

@media (min-width: 810px) and (hover: hover) {
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) {
    cursor: none;
  }

  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) a,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) button,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .nav-logo,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .nav-links a,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .btn-hero,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .btn-primary,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .btn-secondary,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .faq-question,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .nav-contact,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .footer-nav a,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .footer-legal-links a,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .contact-detail a,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .project-card,
  html.js-ready:not(.reduced-motion) body.nanoo-studio:not(.nanoo-no-cursor):not(.elementor-editor-active) .service-card {
    cursor: pointer !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

/* Legal pages */
html.no-js .legal-content h1,
html.js-ready:not(.is-animated) .legal-content h1 {
  opacity: 0;
}
