/* ── Base ───────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background-color: #0a0a0a;
  color: #e8e6e0;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

img, svg { display: block; max-width: 100%; }

:focus-visible {
  outline: 2px solid #cb922e;
  outline-offset: 3px;
  border-radius: 4px;
}

/* ── Glass Card ──────────────────────────────────────────────────────────── */
.glass-card {
  background: rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(203, 146, 46, 0.08);
  transition: border-color 0.3s ease, background 0.3s ease, transform 0.3s ease;
}
.glass-card:hover {
  border-color: rgba(203, 146, 46, 0.35);
  background: rgba(255, 255, 255, 0.05);
  transform: translateY(-4px);
}

/* ── Glow ────────────────────────────────────────────────────────────────── */
.glow-primary {
  box-shadow: 0 0 24px rgba(203, 146, 46, 0.25);
}

/* ── Neural Background ───────────────────────────────────────────────────── */
.neural-bg {
  background-image: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 10 L90 90 M90 10 L10 90' stroke='rgba(203, 146, 46,0.05)' stroke-width='0.5'/%3E%3Ccircle cx='10' cy='10' r='1' fill='rgba(203, 146, 46,0.1)'/%3E%3Ccircle cx='90' cy='90' r='1' fill='rgba(203, 146, 46,0.1)'/%3E%3C/svg%3E");
}

/* ── Blob Gradient ───────────────────────────────────────────────────────── */
.blob-gradient {
  background: linear-gradient(135deg, #cb922e 0%, #a8761f 50%, #8b6f3a 100%);
  filter: blur(70px);
  opacity: 0.25;
  border-radius: 50%;
  pointer-events: none;
}

/* ── Nav scroll state ────────────────────────────────────────────────────── */
#nav {
  transition: background 0.3s ease, border-color 0.3s ease;
}
#nav.scrolled {
  background: rgba(10, 10, 10, 0.95) !important;
  border-color: rgba(203, 146, 46, 0.18) !important;
}

/* ── Scroll Reveal ───────────────────────────────────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal.visible {
  opacity: 1;
  transform: none;
}

.reveal-item {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal-item.visible {
  opacity: 1;
  transform: none;
}

/* ── Hero mobile orb (sostituisce l'immagine nascosta) ───────────────────── */
.hero-mobile-orb {
  position: absolute;
  width: 340px;
  height: 340px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -10%);
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%,
    rgba(203, 146, 46, 0.20),
    rgba(168, 118, 31, 0.12) 40%,
    transparent 70%
  );
  animation: mobileOrb 6s ease-in-out infinite alternate;
  pointer-events: none;
  z-index: 0;
}
@keyframes mobileOrb {
  0%   { transform: translate(-50%, -10%) scale(1);    opacity: 0.7; }
  100% { transform: translate(-50%, -16%) scale(1.18); opacity: 0.35; }
}

/* ── Responsive tweaks ───────────────────────────────────────────────────── */
@media (max-width: 640px) {
  .glass-card:hover {
    transform: none;
  }
  .pro-card::before {
    inset: -1px;
  }
  body {
    overflow-x: hidden;
  }
}

/* ── Float (hero image) ──────────────────────────────────────────────────── */
@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-18px); }
}
.float-anim {
  animation: float 7s ease-in-out infinite;
}

/* ── Scan line (hero image overlay) ─────────────────────────────────────── */
.hero-scan-line {
  position: absolute;
  left: 0; right: 0;
  top: 0;
  height: 2px;
  background: linear-gradient(to right, transparent 0%, #cb922e 30%, #e0ad4d 50%, #cb922e 70%, transparent 100%);
  border-radius: inherit;
  z-index: 20;
  pointer-events: none;
  animation: scanLine 4s linear infinite;
  opacity: 0;
}
@keyframes scanLine {
  0%   { top: 0%;   opacity: 0; }
  5%   { opacity: 0.7; }
  90%  { opacity: 0.4; }
  100% { top: 100%; opacity: 0; }
}

/* ── Glitch (nav logo) — più sobrio, oro ─────────────────────────────────── */
.glitch-text {
  animation: glitch 11s ease-in-out infinite;
}
@keyframes glitch {
  0%, 88%, 100% {
    text-shadow: none;
    transform: none;
  }
  89% {
    text-shadow: 1px 0 #e0ad4d, -1px 0 #a8761f;
    transform: translate(1px, 0);
  }
  91% {
    text-shadow: -1px 0 #e0ad4d, 1px 0 #a8761f;
    transform: translate(-1px, 0);
  }
  93% {
    text-shadow: none;
    transform: none;
  }
}

/* ── Pro card animated gradient border ───────────────────────────────────── */
.pro-card {
  isolation: isolate;
}
.pro-card::before {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: 1.6rem;
  background: linear-gradient(60deg, #cb922e, #e0ad4d, #a8761f, #e0ad4d, #cb922e);
  background-size: 300% 300%;
  animation: proCardBorder 4s linear infinite;
  z-index: -1;
}
@keyframes proCardBorder {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* ── Serif headlines (PDF style) ─────────────────────────────────────────── */
.font-serif-display {
  font-family: "Cormorant Garamond", "Playfair Display", Georgia, serif;
  font-weight: 500;
  letter-spacing: -0.005em;
}

/* ── Reduced motion ──────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal-item {
    opacity: 1;
    transform: none;
    transition: none;
  }
  .glass-card:hover {
    transform: none;
  }
  .animate-pulse,
  .float-anim,
  .hero-scan-line,
  .glitch-text,
  .pro-card::before {
    animation: none !important;
  }
}
