/* ==========================================================================
   PATICHE • TYPOGRAPHIE MAÎTRESSE FRAUNCES & BALAYAGE SHIMMER DORÉ
   Version définitive V4 adoptée
   ========================================================================== */

body,
body[data-theme="v4-fraunces"] {
  font-family: 'Plus Jakarta Sans', system-ui, sans-serif;
}

.logo-main,
.v4-hero-title,
.v4-showcase-title,
.v4-section-title,
.v4-pro-title,
.v4-surmesure-card-title,
.v4-prod-title,
.v4-live-engraving-text,
#v4-mat-title,
.v4-unboxing-content h2,
body[data-theme="v4-fraunces"] .logo-main,
body[data-theme="v4-fraunces"] .v4-hero-title,
body[data-theme="v4-fraunces"] .v4-showcase-title,
body[data-theme="v4-fraunces"] .v4-section-title,
body[data-theme="v4-fraunces"] .v4-pro-title,
body[data-theme="v4-fraunces"] .v4-surmesure-card-title,
body[data-theme="v4-fraunces"] .v4-prod-title,
body[data-theme="v4-fraunces"] .v4-live-engraving-text,
body[data-theme="v4-fraunces"] #v4-mat-title,
body[data-theme="v4-fraunces"] .v4-unboxing-content h2 {
  font-family: 'Fraunces', Georgia, serif !important;
  font-variation-settings: "SOFT" 60, "WONK" 0;
}

/* 1. Balayage Doré Lumineux (Gold Shimmer Sweep) au survol des cartes */
.v4-prod-card,
.v4-hero-showcase-card,
.v4-surmesure-card,
body[data-theme="v4-fraunces"] .v4-prod-card,
body[data-theme="v4-fraunces"] .v4-hero-showcase-card,
body[data-theme="v4-fraunces"] .v4-surmesure-card {
  position: relative;
  overflow: hidden;
}

.v4-prod-card::after,
.v4-hero-showcase-card::after,
.v4-surmesure-card::after,
body[data-theme="v4-fraunces"] .v4-prod-card::after,
body[data-theme="v4-fraunces"] .v4-hero-showcase-card::after,
body[data-theme="v4-fraunces"] .v4-surmesure-card::after {
  content: '';
  position: absolute;
  top: -50%;
  left: -60%;
  width: 50%;
  height: 200%;
  background: linear-gradient(
    60deg,
    transparent 0%,
    rgba(212, 175, 55, 0.03) 40%,
    rgba(255, 235, 175, 0.28) 50%,
    rgba(212, 175, 55, 0.03) 60%,
    transparent 100%
  );
  transform: rotate(25deg);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
  z-index: 8;
}

.v4-prod-card:hover::after,
.v4-hero-showcase-card:hover::after,
.v4-surmesure-card:hover::after,
body[data-theme="v4-fraunces"] .v4-prod-card:hover::after,
body[data-theme="v4-fraunces"] .v4-hero-showcase-card:hover::after,
body[data-theme="v4-fraunces"] .v4-surmesure-card:hover::after {
  opacity: 1;
  animation: v4-shimmer-sweep 1.2s cubic-bezier(0.2, 0.8, 0.2, 1);
}

@keyframes v4-shimmer-sweep {
  0% {
    left: -60%;
  }
  100% {
    left: 140%;
  }
}

/* 2. Micro-animation tactile Pressed Paper (Haptique visuel) */
.v4-btn-primary:active,
.v4-btn-secondary:active,
.v4-universe-pill-btn:active,
.v4-quickbar-cta:active,
body[data-theme="v4-fraunces"] .v4-btn-primary:active,
body[data-theme="v4-fraunces"] .v4-btn-secondary:active,
body[data-theme="v4-fraunces"] .v4-universe-pill-btn:active,
body[data-theme="v4-fraunces"] .v4-quickbar-cta:active {
  transform: translateY(2px) scale(0.985) !important;
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.2) !important;
}

/* 3. Sceau de Cire avec attraction magnétique */
.v4-wax-seal,
body[data-theme="v4-fraunces"] .v4-wax-seal {
  transition: transform 0.2s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.2s ease;
  will-change: transform;
}



/* Désactivation sous prefers-reduced-motion (WCAG 2.2 AA) */
@media (prefers-reduced-motion: reduce) {
  body[data-theme="v4-fraunces"] .v4-prod-card::after,
  body[data-theme="v4-fraunces"] .v4-hero-showcase-card::after,
  body[data-theme="v4-fraunces"] .v4-surmesure-card::after {
    animation: none !important;
    display: none !important;
  }
  body[data-theme="v4-fraunces"] .v4-wax-seal {
    transform: none !important;
  }
}