@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Gloock&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap');
@import url('https://api.fontshare.com/v2/css?f[]=satoshi@400,500,700&display=swap');

:root {
  /* Palette Aura — noir, or, brun, gris clair */
  --hx-black: #070707;
  --hx-gold: #e8c382;
  --hx-brown: #351e10;
  --hx-light: #ededec;
  --hx-white: #ffffff;
  --hx-muted: #737373;
  --hx-muted-light: #a3a3a3;

  /* Alias compatibilité */
  --hx-navy-950: var(--hx-black);
  --hx-navy-900: var(--hx-black);
  --hx-navy-800: var(--hx-brown);
  --hx-navy-700: var(--hx-brown);
  --hx-navy-600: #4a3020;
  --hx-navy-500: #5c4030;
  --hx-navy-400: var(--hx-muted);

  --hx-bg: var(--hx-light);
  --hx-bg-soft: var(--hx-light);
  --hx-surface: var(--hx-white);
  --hx-surface-alt: var(--hx-light);
  --hx-surface-bright: var(--hx-white);

  --hx-gold-dark: var(--hx-brown);
  --hx-gold-muted: #8b6914;
  --hx-gold-light: var(--hx-gold);
  --hx-gold-pale: #f0dcc0;
  --hx-gold-bright: var(--hx-gold);
  --hx-gold-deep: var(--hx-brown);

  --hx-text: var(--hx-brown);
  --hx-text-muted: var(--hx-muted);
  --hx-text-soft: var(--hx-muted-light);

  --hx-blue-deep: var(--hx-brown);
  --hx-blue-mid: var(--hx-brown);
  --hx-blue: var(--hx-brown);
  --hx-blue-accent: var(--hx-gold);
  --hx-blue-bright: var(--hx-gold);
  --hx-blue-light: var(--hx-muted-light);
  --hx-blue-pale: var(--hx-light);
  --hx-blue-border: rgba(0, 0, 0, 0.12);
  --hx-cream: var(--hx-light);
  --hx-dark: var(--hx-black);
  --hx-dark-2: var(--hx-brown);
  --hx-border: rgba(0, 0, 0, 0.1);

  --hx-blue-glow: rgba(232, 195, 130, 0.06);
  --hx-blue-glow-strong: rgba(232, 195, 130, 0.1);
  --hx-blue-border-a: rgba(255, 255, 255, 0.12);
  --hx-navy-border-a: rgba(255, 255, 255, 0.12);
}

body {
  font-family: 'Satoshi', 'Inter', sans-serif;
  background-color: var(--hx-light);
  color: var(--hx-text-muted);
  color-scheme: light;
}

html {
  color-scheme: light;
}

/* ── Bandes de section (style Aura) ── */
.hx-band-dark {
  --hx-band-bg: var(--hx-black);
  --hx-band-text: var(--hx-white);
  --hx-band-heading: var(--hx-white);
  --hx-band-muted: var(--hx-muted-light);
  --hx-band-label: var(--hx-gold);
  --hx-band-accent: var(--hx-gold);
  --hx-band-card-bg: var(--hx-brown);
  --hx-band-card-border: rgba(255, 255, 255, 0.12);
  --hx-band-divider: rgba(255, 255, 255, 0.1);
}

.hx-band-light {
  --hx-band-bg: var(--hx-light);
  --hx-band-text: var(--hx-black);
  --hx-band-heading: var(--hx-black);
  --hx-band-muted: #525252;
  --hx-band-label: var(--hx-brown);
  --hx-band-accent: var(--hx-brown);
  --hx-band-card-bg: var(--hx-white);
  --hx-band-card-border: rgba(0, 0, 0, 0.1);
  --hx-band-divider: rgba(0, 0, 0, 0.1);
}

.hx-band-gold {
  --hx-band-bg: var(--hx-gold);
  --hx-band-text: var(--hx-brown);
  --hx-band-heading: var(--hx-brown);
  --hx-band-muted: #5c4030;
  --hx-band-label: var(--hx-brown);
  --hx-band-accent: var(--hx-brown);
  --hx-band-card-bg: var(--hx-white);
  --hx-band-card-border: rgba(0, 0, 0, 0.12);
  --hx-band-divider: rgba(0, 0, 0, 0.15);
}

.hx-band-brown {
  --hx-band-bg: var(--hx-brown);
  --hx-band-text: var(--hx-gold);
  --hx-band-heading: var(--hx-white);
  --hx-band-muted: #d4b896;
  --hx-band-label: var(--hx-gold);
  --hx-band-accent: var(--hx-gold);
  --hx-band-card-bg: rgba(0, 0, 0, 0.25);
  --hx-band-card-border: rgba(232, 195, 130, 0.25);
  --hx-band-divider: rgba(232, 195, 130, 0.2);
}

[class*="hx-band-"] {
  background-color: var(--hx-band-bg);
  color: var(--hx-band-text);
  border-color: var(--hx-band-divider);
}

[class*="hx-band-"] .hx-section-title,
[class*="hx-band-"] .text-\[\#1C1610\],
[class*="hx-band-"] h3.text-\[\#1C1610\] {
  color: var(--hx-band-heading) !important;
}

[class*="hx-band-"] .text-\[\#A67B2D\],
[class*="hx-band-"] .text-\[\#B8956A\],
[class*="hx-band-"] .text-\[\#D4B896\],
[class*="hx-band-"] .text-\[\#E8DCC4\],
[class*="hx-band-"] .text-\[\#F0E8DA\] {
  color: var(--hx-band-label) !important;
}

[class*="hx-band-"] .text-stone-400,
[class*="hx-band-"] .text-stone-500,
[class*="hx-band-"] .text-stone-600,
[class*="hx-band-"] .text-stone-700 {
  color: var(--hx-band-muted) !important;
}

[class*="hx-band-"] .bg-\[\#FAF7F0\],
[class*="hx-band-"] .bg-white,
[class*="hx-band-"] .bg-white\/80 {
  background-color: var(--hx-band-card-bg) !important;
}

[class*="hx-band-"] .border-\[\#F0E8DA\],
[class*="hx-band-"] .border-\[\#E8DCC4\],
[class*="hx-band-"] .border-stone-100 {
  border-color: var(--hx-band-card-border) !important;
}

[class*="hx-band-"] .border-\[\#3D3428\] {
  border-color: var(--hx-band-card-border) !important;
}

[class*="hx-band-"] .bg-\[\#A67B2D\]\/50 {
  background-color: var(--hx-band-card-bg) !important;
}

[class*="hx-band-"] iconify-icon.text-\[\#B8956A\],
[class*="hx-band-"] iconify-icon.text-\[\#A67B2D\],
[class*="hx-band-"] iconify-icon.text-\[\#D4B896\],
[class*="hx-band-"] iconify-icon.text-\[\#E8DCC4\] {
  color: var(--hx-band-accent) !important;
}

#gallery {
  background-color: #070707;
  color: #ffffff;
  overflow-x: clip;
  max-width: 100%;
}

#gallery .hx-gallery-panel {
  position: sticky;
  top: 0;
  width: 100%;
  min-height: 100vh;
  min-height: 100svh;
  height: 100vh;
  height: 100svh;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  isolation: isolate;
}

#gallery .hx-gallery-panel__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}

#gallery .hx-gallery-panel__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.1);
  filter: blur(48px);
  opacity: 0.4;
}

#gallery .hx-gallery-watermark {
  position: absolute;
  z-index: 10;
  left: 50%;
  width: 100%;
  max-width: 100%;
  transform: translateX(-50%);
  text-align: center;
  pointer-events: none;
  opacity: 0.3;
  mix-blend-mode: overlay;
  overflow: hidden;
}

#gallery .hx-gallery-watermark h3 {
  font-size: clamp(2.75rem, 25vw, 12rem);
  line-height: 0.8;
  letter-spacing: -0.04em;
  text-transform: uppercase;
  white-space: nowrap;
}

#gallery .hx-gallery-frame {
  position: relative;
  z-index: 20;
  width: min(92vw, 65rem);
  height: min(60vh, 60svh);
  max-height: calc(100svh - 9rem);
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: #000;
  overflow: hidden;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.55);
}

#gallery .hx-gallery-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.9;
}

#gallery .hx-gallery-panel--accent .hx-gallery-frame {
  border-color: rgba(232, 195, 130, 0.3);
}

#gallery .hx-gallery-panel--accent .hx-gallery-frame img {
  filter: contrast(1.25);
}

#gallery .hx-gallery-panel--accent .hx-gallery-watermark h3,
#gallery .hx-gallery-panel--accent .hx-gallery-meta--num,
#gallery .hx-gallery-panel--accent .hx-gallery-meta--category {
  color: #e8c382;
}

#gallery .hx-gallery-meta {
  position: absolute;
  z-index: 30;
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1.35;
}

#gallery .hx-gallery-meta--num {
  top: 2rem;
  left: 2rem;
  font-weight: 500;
}

#gallery .hx-gallery-meta--tag {
  top: 2rem;
  right: 2rem;
  color: #737373;
}

#gallery .hx-gallery-meta--title {
  bottom: 2rem;
  left: 2rem;
  max-width: min(12rem, 42vw);
  font-weight: 500;
}

#gallery .hx-gallery-meta--category {
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  color: #737373;
  text-align: center;
  white-space: nowrap;
}

#gallery .hx-gallery-meta--year {
  bottom: 2rem;
  right: 2rem;
  color: #737373;
}

.font-gloock {
  font-family: 'Gloock', serif !important;
}

.font-manrope {
  font-family: 'Manrope', sans-serif !important;
}

#pricing .hx-section-title,
#pricing .hx-section-title span,
#catering-packages .hx-section-title,
#catering-packages .hx-section-title span {
  color: #f5d078 !important;
}

#pricing {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse 75% 60% at 50% 50%, rgba(15, 40, 71, 0.58) 0%, transparent 65%),
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(42, 96, 144, 0.18) 0%, transparent 58%),
    radial-gradient(circle at 12% 75%, rgba(15, 40, 71, 0.22) 0%, transparent 42%),
    radial-gradient(circle at 88% 55%, rgba(30, 73, 118, 0.14) 0%, transparent 38%),
    #030810 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

#pricing .hx-pricing-card {
  background: linear-gradient(165deg, #3d2618 0%, #2a170f 100%) !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
}

#pricing .hx-pricing-card h3 {
  color: #ffffff !important;
  font-size: 1.75rem;
  margin-bottom: 0.75rem;
}

#catering-packages .hx-pricing-card h3 {
  color: #f5d078 !important;
  font-size: 1.75rem;
  margin-bottom: 0.75rem;
}

#pricing .hx-pricing-quote {
  display: inline-block;
  margin-bottom: 1rem;
  padding: 0.4rem 0.9rem;
  border-radius: 999px;
  background: rgba(232, 195, 130, 0.22);
  border: 1px solid rgba(232, 195, 130, 0.55);
  color: #fdf6e8 !important;
  font-size: 0.75rem;
  font-weight: 600;
  font-style: normal;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

#pricing .hx-pricing-desc {
  color: #f5ede0 !important;
  font-size: 0.95rem;
  line-height: 1.55;
  margin-bottom: 1.5rem;
}

#pricing .hx-pricing-features {
  color: #ffffff !important;
  font-size: 0.9rem;
  line-height: 1.45;
}

#pricing .hx-pricing-features iconify-icon {
  color: #e8c382 !important;
  flex-shrink: 0;
  font-size: 1.15rem;
}

footer.hx-band-dark .text-stone-500,
footer.hx-band-dark .text-stone-900 {
  color: var(--hx-muted-light) !important;
}

footer.hx-band-dark h4.text-stone-900 {
  color: var(--hx-white) !important;
}

footer.hx-band-dark .font-cormorant.text-\[\#1C1610\] {
  color: var(--hx-gold) !important;
}

.hx-band-brown .text-white {
  color: var(--hx-white) !important;
}

.hx-text-gold-vivid {
  color: #f5d078 !important;
}

#why-hexagone {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse 70% 55% at 50% 45%, rgba(15, 40, 71, 0.55) 0%, transparent 62%),
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(42, 96, 144, 0.16) 0%, transparent 58%),
    radial-gradient(circle at 12% 75%, rgba(15, 40, 71, 0.22) 0%, transparent 42%),
    radial-gradient(circle at 88% 55%, rgba(30, 73, 118, 0.12) 0%, transparent 38%),
    #030810 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

#why-hexagone .text-\[\#1C1610\],
#why-hexagone .text-\[\#A67B2D\],
#why-hexagone .text-\[\#B8956A\],
#why-hexagone .text-stone-700,
#why-hexagone h3,
#why-hexagone iconify-icon.text-\[\#A67B2D\],
#why-hexagone iconify-icon.text-\[\#B8956A\] {
  color: #f5d078 !important;
}

/* Cartes blanches — texte doré lisible */
#why-hexagone .bg-\[\#FAF7F0\] {
  background-color: #ffffff !important;
  border-color: rgba(212, 175, 55, 0.35) !important;
  box-shadow: 0 10px 36px rgba(0, 0, 0, 0.28);
}

#why-hexagone .bg-\[\#FAF7F0\] .border-\[\#E8DCC4\] {
  border-color: rgba(201, 148, 26, 0.28) !important;
}

#why-hexagone .bg-\[\#FAF7F0\] .text-\[\#1C1610\],
#why-hexagone .bg-\[\#FAF7F0\] .text-stone-700,
#why-hexagone .bg-\[\#FAF7F0\] .font-medium,
#why-hexagone .bg-\[\#FAF7F0\] iconify-icon {
  color: #c9941a !important;
}

#why-hexagone .bg-\[\#FAF7F0\] .text-sm.font-medium {
  font-weight: 600;
  color: #b8860b !important;
}

#why-hexagone .bg-\[\#FAF7F0\] .text-stone-500 {
  color: #8b6914 !important;
  font-weight: 500;
}

/* Stats — By the numbers */
#stats .hx-stats-grid > div {
  background-color: #ffffff !important;
  border-color: rgba(212, 175, 55, 0.35) !important;
  box-shadow: 0 10px 36px rgba(0, 0, 0, 0.28);
}

#stats .hx-stats-grid span.block.font-cormorant {
  color: #c9941a !important;
}

#stats .hx-stats-grid .text-xs.font-medium {
  color: #b8860b !important;
  font-weight: 600;
}

/* Carte Photo & video — dorée sur fond blanc */
.hx-gold-card {
  background-color: #ffffff !important;
  border-color: rgba(212, 175, 55, 0.35) !important;
  box-shadow: 0 10px 36px rgba(0, 0, 0, 0.12);
}

.hx-gold-card h3 {
  color: #c9941a !important;
  font-weight: 500;
}

.hx-gold-card p {
  color: #8b6914 !important;
  font-weight: 500;
}

.hx-gold-card__arrow {
  background: rgba(201, 148, 26, 0.1) !important;
  border: 1px solid rgba(201, 148, 26, 0.3);
  color: #c9941a !important;
}

.hx-gold-card:hover .hx-gold-card__arrow {
  background: #c9941a !important;
  color: #ffffff !important;
}

.theme-transition,
.theme-transition * {
  transition: background-color 240ms ease, color 240ms ease, border-color 240ms ease;
}

.font-cormorant {
  font-family: 'Cormorant Garamond', serif;
}

.reveal {
  opacity: 0;
  transform: translateY(30px) scale(0.98);
  transition: all 1s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.reveal.active {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.delay-100 { transition-delay: 0.1s; }
.delay-200 { transition-delay: 0.2s; }
.delay-300 { transition-delay: 0.3s; }
.delay-400 { transition-delay: 0.4s; }

@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

.animate-float {
  animation: float 6s ease-in-out infinite;
}

@keyframes blob {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(30px, -50px) scale(1.1); }
  66% { transform: translate(-20px, 20px) scale(0.9); }
}

.animate-blob {
  animation: blob 7s infinite;
}

.hero-shell {
  background: var(--hx-bg);
}

.hero-surface {
  background: var(--hx-surface);
}

.hero-glow {
  display: none;
}

.hero-copy {
  background: rgba(245, 247, 250, 0.78);
  border: 1px solid var(--hx-blue-border-a);
  backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.85) inset;
}

.hero-info-card {
  background: rgba(245, 247, 250, 0.9);
  border-color: var(--hx-blue-border-a);
  box-shadow: 0 8px 32px rgba(15, 40, 71, 0.1);
}

body.dark .hero-shell {
  background: var(--hx-navy-950);
}

body.dark .hero-surface {
  background: var(--hx-navy-900);
  border-color: var(--hx-navy-border-a) !important;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.55) !important;
}

body.dark .hero-backdrop {
  opacity: 0.18;
  filter: saturate(0.5) brightness(0.35);
}

body.dark .hero-glow {
  display: none;
}

body.dark .hero-copy {
  background: rgba(10, 10, 10, 0.72);
  border-color: #262626;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.04) inset;
}

body.dark .hero-copy .inline-flex {
  background: rgba(0, 0, 0, 0.55) !important;
  border-color: #333333 !important;
}

body.dark .hero-copy .inline-flex span:last-child {
  color: #d4d4d4 !important;
}

body.dark .hero-copy h1 {
  color: #ffffff !important;
}

body.dark .hero-copy h1 span {
  color: #737373 !important;
}

body.dark .hero-copy p {
  color: #a3a3a3 !important;
}

body.dark .hero-copy a[href="#contact"] {
  background: #ffffff !important;
  color: #000000 !important;
}

body.dark .hero-copy a[href="#contact"]:hover {
  background: #e5e5e5 !important;
}

body.dark .hero-copy a[href="#services"] {
  background: rgba(255, 255, 255, 0.04) !important;
  color: #fafafa !important;
  border-color: #333333 !important;
}

body.dark .hero-copy a[href="#services"]:hover {
  background: rgba(255, 255, 255, 0.08) !important;
}

body.dark .hero-info-card {
  background: rgba(0, 0, 0, 0.78);
  border-color: #333333;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6);
}

body.dark .hero-info-card p,
body.dark .hero-info-card div {
  color: #e5e5e5 !important;
}

body.dark .hero-info-card .text-stone-400 {
  color: #737373 !important;
}

body.dark .hero-info-card iconify-icon {
  color: var(--hx-gold) !important;
}

body.dark .hero-grid > div:last-child {
  border-color: #262626 !important;
}

/* Floating pill navigation — mode clair */
.nav-pill {
  background: rgba(7, 7, 7, 0.75);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
}

.nav-pill.nav-scrolled {
  background: rgba(7, 7, 7, 0.92);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
}

.nav-brand {
  color: var(--hx-gold);
}

.nav-link {
  color: var(--hx-muted-light);
}

.nav-link:hover {
  color: var(--hx-white);
  background: rgba(255, 255, 255, 0.06);
}

.nav-icon-btn {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--hx-gold);
}

.nav-icon-btn:hover {
  background: rgba(255, 255, 255, 0.1);
}

.nav-mobile-panel {
  background: rgba(7, 7, 7, 0.98);
}

.nav-mobile-link {
  color: var(--hx-muted-light);
}

.nav-mobile-link:hover {
  color: var(--hx-gold);
  background: rgba(255, 255, 255, 0.05);
}

.nav-mobile-panel__header .nav-mobile-brand__name {
  color: #e8c382 !important;
}

.nav-mobile-panel__header iconify-icon {
  color: var(--hx-gold) !important;
}

/* Boutons CTA — or piquant + étoiles au survol */
.hx-cta-sparkle,
.nav-cta {
  position: relative;
  isolation: isolate;
  overflow: visible;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
  transition:
    background 0.35s ease,
    box-shadow 0.35s ease,
    transform 0.2s ease,
    color 0.25s ease;
}

.hx-cta-sparkle.w-full {
  display: flex;
  width: 100%;
}

.hx-cta-sparkle__label,
.nav-cta__label {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.hx-cta-sparkle__spark,
.nav-cta__spark {
  position: absolute;
  z-index: 3;
  font-size: 0.55rem;
  line-height: 1;
  color: #fff;
  opacity: 0;
  pointer-events: none;
  text-shadow: 0 0 6px rgba(255, 255, 255, 0.9);
  transform: scale(0.2);
}

.hx-cta-sparkle__spark--1,
.nav-cta__spark--1 { top: 0.15rem; left: 0.65rem; }
.hx-cta-sparkle__spark--2,
.nav-cta__spark--2 { top: 0.2rem; right: 0.7rem; }
.hx-cta-sparkle__spark--3,
.nav-cta__spark--3 { bottom: 0.1rem; left: 50%; margin-left: -0.25rem; font-size: 0.65rem; }
.hx-cta-sparkle__spark--4,
.nav-cta__spark--4 { top: 50%; right: 0.25rem; margin-top: -0.35rem; }

.hx-cta-sparkle::after,
.nav-cta::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  background: linear-gradient(
    105deg,
    transparent 35%,
    rgba(255, 255, 255, 0.55) 50%,
    transparent 65%
  );
  transform: translateX(-130%);
  transition: transform 0.55s ease;
  pointer-events: none;
}

.hx-cta-sparkle:hover,
.nav-cta:hover {
  background: linear-gradient(135deg, #ffe08a 0%, #f5d078 42%, #e6b422 100%) !important;
  color: #2a1805 !important;
  border-color: rgba(255, 230, 150, 0.65) !important;
  box-shadow:
    0 0 0 1px rgba(255, 230, 150, 0.65),
    0 4px 22px rgba(245, 208, 120, 0.65),
    0 0 28px rgba(232, 195, 130, 0.45);
  transform: scale(1.04);
}

.hx-cta-sparkle.hero-btn:hover {
  transform: scale(1.04) translateY(-2px);
}

.hx-cta-sparkle:hover::after,
.nav-cta:hover::after {
  transform: translateX(130%);
}

.hx-cta-sparkle:hover .hx-cta-sparkle__spark,
.hx-cta-sparkle:hover .nav-cta__spark,
.nav-cta:hover .nav-cta__spark {
  animation: hxCtaSpark 1.1s ease-in-out infinite;
}

.hx-cta-sparkle:hover .hx-cta-sparkle__spark--1,
.nav-cta:hover .nav-cta__spark--1 { animation-delay: 0s; }
.hx-cta-sparkle:hover .hx-cta-sparkle__spark--2,
.nav-cta:hover .nav-cta__spark--2 { animation-delay: 0.25s; }
.hx-cta-sparkle:hover .hx-cta-sparkle__spark--3,
.nav-cta:hover .nav-cta__spark--3 { animation-delay: 0.5s; }
.hx-cta-sparkle:hover .hx-cta-sparkle__spark--4,
.nav-cta:hover .nav-cta__spark--4 { animation-delay: 0.75s; }

@keyframes hxCtaSpark {
  0%, 100% {
    opacity: 0;
    transform: scale(0.2) rotate(0deg);
  }
  45%, 55% {
    opacity: 1;
    transform: scale(1.35) rotate(180deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hx-cta-sparkle:hover .hx-cta-sparkle__spark,
  .nav-cta:hover .nav-cta__spark {
    animation: none;
    opacity: 0.85;
    transform: scale(1);
  }

  .hx-cta-sparkle::after,
  .hx-cta-sparkle:hover::after,
  .nav-cta::after,
  .nav-cta:hover::after {
    transition: none;
    transform: none;
    opacity: 0;
  }
}

body.dark {
  background-color: var(--hx-black) !important;
  color: var(--hx-muted-light) !important;
  color-scheme: dark;
}

html.dark {
  background: var(--hx-navy-950);
}

body.dark ::selection {
  background: rgba(184, 151, 90, 0.35);
  color: #fff;
}

body.dark .nav-pill {
  background: rgba(10, 25, 41, 0.92);
  border-color: var(--hx-navy-border-a);
  box-shadow:
    0 4px 32px rgba(0, 0, 0, 0.45),
    0 1px 0 rgba(61, 106, 148, 0.12) inset;
}

body.dark .nav-pill.nav-scrolled {
  background: rgba(6, 15, 24, 0.96);
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.55);
}

body.dark .nav-brand {
  color: var(--hx-gold);
}

body.dark .nav-link {
  color: var(--hx-blue-light);
}

body.dark .nav-link:hover {
  color: var(--hx-gold-bright);
  background: rgba(30, 73, 118, 0.35);
}

body.dark .nav-icon-btn {
  background: rgba(15, 40, 71, 0.65);
  border-color: var(--hx-navy-border-a);
  color: var(--hx-gold-light);
}

body.dark .nav-icon-btn:hover {
  background: rgba(22, 54, 86, 0.75);
}

body.dark .nav-mobile-panel {
  background: rgba(6, 15, 24, 0.98);
}

body.dark .nav-mobile-link {
  color: var(--hx-blue-light);
}

body.dark .nav-mobile-link:hover {
  color: var(--hx-gold-bright);
  background: rgba(15, 40, 71, 0.55);
}

body.dark section,
body.dark footer,
body.dark header {
  border-color: var(--hx-navy-border-a) !important;
}

body.dark .bg-white,
body.dark .bg-white\/80,
body.dark .bg-white\/90 {
  background-color: rgba(15, 40, 71, 0.88) !important;
}

body.dark .text-\[\#1C1610\],
body.dark .text-stone-900,
body.dark .text-stone-700 {
  color: var(--hx-gold-bright) !important;
}

body.dark .text-\[\#A67B2D\],
body.dark .text-\[\#B8956A\],
body.dark .text-\[\#D4B896\],
body.dark .text-\[\#E8DCC4\],
body.dark .text-\[\#F0E8DA\] {
  color: var(--hx-gold-light) !important;
}

body.dark .bg-\[\#A67B2D\],
body.dark .bg-\[\#A67B2D\]\/50 {
  background-color: rgba(139, 105, 20, 0.55) !important;
  border-color: rgba(184, 151, 90, 0.35) !important;
}

body.dark .bg-\[\#C9A962\] {
  background-color: var(--hx-gold) !important;
  color: var(--hx-navy-900) !important;
}

body.dark .border-\[\#C9A962\] {
  border-color: rgba(184, 151, 90, 0.55) !important;
}

body.dark iconify-icon.text-\[\#B8956A\],
body.dark iconify-icon.text-\[\#A67B2D\],
body.dark iconify-icon.text-\[\#D4B896\],
body.dark iconify-icon.text-\[\#E8DCC4\] {
  color: var(--hx-gold-light) !important;
}

body.dark .border-\[\#F0E8DA\],
body.dark .border-stone-100,
body.dark .border-\[\#E8DCC4\],
body.dark .border-white\/50 {
  border-color: var(--hx-navy-border-a) !important;
}

body.dark .bg-\[\#FAF7F0\],
body.dark .bg-\[\#F0E8DA\] {
  background-color: rgba(15, 40, 71, 0.4) !important;
}

body.dark .bg-\[\#2A2218\] {
  background-color: rgba(10, 25, 41, 0.95) !important;
  border-color: var(--hx-navy-border-a) !important;
}

body.dark .bg-\[\#2A2218\]\/50 {
  background-color: rgba(15, 40, 71, 0.7) !important;
}

body.dark .bg-\[\#1C1610\] {
  background-color: var(--hx-navy-900) !important;
}

body.dark .border-\[\#3D3428\] {
  border-color: var(--hx-navy-border-a) !important;
}

body.dark .border-4.border-\[\#FAF7F0\] {
  border-color: var(--hx-navy-900) !important;
  background-color: rgba(10, 25, 41, 0.92) !important;
}

body.dark .bg-\[\#3D3428\] {
  background-color: rgba(15, 40, 71, 0.55) !important;
}

body.dark #services .bg-\[\#E8DCC4\] {
  background-color: rgba(15, 40, 71, 0.6) !important;
}

body.dark #contact .bg-\[\#F0E8DA\] {
  background-color: rgba(10, 25, 41, 0.8) !important;
  border: 1px solid var(--hx-navy-border-a);
}

body.dark .hover\:border-\[\#C9A962\]:hover {
  border-color: var(--hx-gold) !important;
}

body.dark .text-stone-600,
body.dark .text-stone-500 {
  color: var(--hx-gold-light) !important;
}

body.dark .text-stone-400 {
  color: var(--hx-blue-light) !important;
}

body.dark .bg-stone-100 {
  background-color: rgba(15, 40, 71, 0.5) !important;
}

body.dark #services .bg-amber-100 {
  background-color: rgba(22, 54, 86, 0.25) !important;
}

body.dark #contact form {
  background-color: rgba(6, 15, 24, 0.95) !important;
  border-color: var(--hx-navy-border-a) !important;
}

body.dark #contact input,
body.dark #contact select,
body.dark #contact textarea {
  background-color: rgba(15, 40, 71, 0.55) !important;
  border-color: var(--hx-navy-border-a) !important;
  color: var(--hx-gold-light) !important;
}

body.dark #contact input::placeholder,
body.dark #contact textarea::placeholder {
  color: rgba(158, 179, 199, 0.5);
}

body.dark footer {
  background-color: var(--hx-navy-950) !important;
}

body.dark .text-white {
  color: #ffffff !important;
}

body.dark .bg-red-50 {
  background-color: rgba(127, 29, 29, 0.25) !important;
}

body.dark .bg-orange-50 {
  background-color: rgba(124, 45, 18, 0.2) !important;
}

body.dark #contact .rounded-full.blur-3xl {
  opacity: 0.28;
}

body.dark #services .animate-blob {
  opacity: 0.18;
}

body.dark .shadow-2xl,
body.dark .shadow-xl,
body.dark .shadow-lg,
body.dark .shadow-sm {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45) !important;
}

body.dark #contact input:focus,
body.dark #contact select:focus,
body.dark #contact textarea:focus {
  border-color: var(--hx-gold) !important;
}

body.dark a.rounded-full.bg-white {
  background-color: var(--hx-gold) !important;
  color: var(--hx-navy-900) !important;
}

body.dark a.rounded-full.bg-white:hover {
  background-color: var(--hx-gold-bright) !important;
}

body.dark ::selection {
  background: rgba(184, 151, 90, 0.35);
  color: #fff;
}

/* Hexagone logo — navigation only */
.hx-logo {
  display: block;
  object-fit: cover;
  flex-shrink: 0;
  width: 100%;
  height: 100%;
}

.hx-logo-wrap {
  overflow: hidden;
  border-radius: 9999px;
  border: 1px solid rgba(232, 195, 130, 0.35);
  background-color: var(--hx-brown);
  box-shadow: 0 0 12px rgba(0, 0, 0, 0.4);
  flex-shrink: 0;
}

.hx-logo-wrap--nav { width: 2rem; height: 2rem; }
@media (min-width: 640px) {
  .hx-logo-wrap--nav { width: 2.25rem; height: 2.25rem; }
}

body.dark .hx-logo-wrap {
  border-color: rgba(61, 106, 148, 0.65);
  box-shadow: 0 0 16px rgba(15, 40, 71, 0.55);
}


/* ── Mode clair — remaps Tailwind (dark mode inchangé) ── */
body:not(.dark) .bg-\[\#FAF7F0\] { background-color: var(--hx-bg) !important; }
body:not(.dark) .bg-\[\#F0E8DA\] { background-color: var(--hx-blue-pale) !important; }
body:not(.dark) .bg-\[\#E8DCC4\] { background-color: var(--hx-surface-alt) !important; }
body:not(.dark) .bg-\[\#1C1610\] { background-color: var(--hx-navy-900) !important; }
body:not(.dark) .bg-\[\#2A2218\] { background-color: var(--hx-navy-700) !important; }
body:not(.dark) .bg-white { background-color: #ffffff !important; }
body:not(.dark) .bg-white\/80 { background-color: rgba(255, 255, 255, 0.94) !important; }
body:not(.dark) .bg-white\/90 { background-color: rgba(255, 255, 255, 0.96) !important; }

/* Texte courant — navy lisible */
body:not(.dark) .text-\[\#1C1610\] { color: var(--hx-navy-800) !important; }
body:not(.dark) .text-stone-600 { color: #475569 !important; }
body:not(.dark) .text-stone-500 { color: #64748b !important; }
body:not(.dark) .text-stone-400 { color: #94a3b8 !important; }
body:not(.dark) .text-stone-900 { color: var(--hx-navy-800) !important; }

/* Titres & display — or */
body:not(.dark) .font-cormorant.text-\[\#1C1610\],
body:not(.dark) .hx-section-title,
body:not(.dark) h1.font-cormorant,
body:not(.dark) h2.font-cormorant,
body:not(.dark) h3.font-cormorant { color: var(--hx-gold-dark) !important; }

/* Labels & accents — or */
body:not(.dark) .text-\[\#A67B2D\] { color: var(--hx-gold-dark) !important; }
body:not(.dark) .text-\[\#B8956A\] { color: var(--hx-gold-muted) !important; }
body:not(.dark) .text-\[\#D4B896\],
body:not(.dark) .text-\[\#E8DCC4\],
body:not(.dark) .text-\[\#F0E8DA\] { color: var(--hx-gold-muted) !important; }

body:not(.dark) .bg-\[\#A67B2D\],
body:not(.dark) a.bg-\[\#A67B2D\] { background-color: var(--hx-gold-dark) !important; }
body:not(.dark) .bg-\[\#C9A962\],
body:not(.dark) a.bg-\[\#C9A962\] { background-color: var(--hx-gold) !important; }
body:not(.dark) .bg-\[\#C9A962\]\/25 { background-color: rgba(184, 151, 90, 0.22) !important; }
body:not(.dark) .bg-\[\#A67B2D\]\/50 { background-color: rgba(139, 105, 20, 0.42) !important; }
body:not(.dark) .hover\:bg-\[\#B8956A\]:hover { background-color: var(--hx-gold-muted) !important; }

body:not(.dark) .border-\[\#C9A962\] { border-color: var(--hx-gold) !important; }
body:not(.dark) .border-\[\#C9A962\]\/40 { border-color: rgba(184, 151, 90, 0.42) !important; }

body:not(.dark) iconify-icon.text-\[\#B8956A\],
body:not(.dark) iconify-icon.text-\[\#A67B2D\],
body:not(.dark) iconify-icon.text-\[\#D4B896\] {
  color: var(--hx-gold-muted) !important;
}

body:not(.dark) #services .bg-\[\#F0E8DA\] {
  color: var(--hx-gold-muted) !important;
}
body:not(.dark) .border-\[\#F0E8DA\],
body:not(.dark) .border-\[\#E8DCC4\] { border-color: var(--hx-blue-border) !important; }
body:not(.dark) .border-\[\#3D3428\] { border-color: rgba(15, 40, 71, 0.15) !important; }
body:not(.dark) .border-stone-100 { border-color: var(--hx-blue-border) !important; }
body:not(.dark) .border-4.border-\[\#FAF7F0\] { border-color: #ffffff !important; }

body:not(.dark) .hover\:text-\[\#B8956A\]:hover { color: var(--hx-gold) !important; }
body:not(.dark) .hover\:border-\[\#C9A962\]:hover { border-color: var(--hx-gold) !important; }
body:not(.dark) .hover\:bg-\[\#1C1610\]:hover { background-color: var(--hx-navy-900) !important; }

body:not(.dark) .shadow-\[\#F0E8DA\] { --tw-shadow-color: rgba(15, 40, 71, 0.08) !important; }
body:not(.dark) .shadow-sm { box-shadow: 0 1px 3px rgba(15, 40, 71, 0.06) !important; }
body:not(.dark) .shadow-xl { box-shadow: 0 16px 40px rgba(15, 40, 71, 0.08) !important; }

body:not(.dark) ::selection {
  background: rgba(184, 151, 90, 0.28);
  color: var(--hx-navy-900);
}

body:not(.dark) #services .bg-amber-100 {
  background-color: rgba(184, 151, 90, 0.07) !important;
}

body:not(.dark) #services .bg-\[\#E8DCC4\] {
  background-color: var(--hx-surface-alt) !important;
}

body:not(.dark) #contact form {
  background-color: #ffffff !important;
}

body:not(.dark) .italic.text-stone-400 {
  color: #94a3b8 !important;
}

body:not(.dark) .hx-trust-logos {
  opacity: 0.55;
}

body:not(.dark) .hx-trust-logos:hover {
  opacity: 1;
}

body:not(.dark) .hx-events-card,
body:not(.dark) .bg-\[\#FAF7F0\].rounded-3xl {
  border-color: var(--hx-blue-border) !important;
}

body:not(.dark) footer {
  background-color: #ffffff !important;
}