app/globals.css

@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&display=swap');
@import "tailwindcss";

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Cormorant Garamond', Georgia, serif;
  background: #fff;
  color: #0D1117;
}

.logo-live {
  background: linear-gradient(180deg,#f5e070 0%,#c8a951 18%,#f0d060 35%,#8B6914 50%,#d4a832 65%,#f5e070 80%,#a07820 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  display: inline-block;
  filter: drop-shadow(0 1px 2px rgba(180,130,20,0.4));
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.3; }
}

@keyframes orb-float {
  0%, 100% { transform: translateY(0px) scale(1); }
  50% { transform: translateY(-14px) scale(1.04); }
}

@keyframes orb-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

@keyframes wave-bar {
  0%, 100% { transform: scaleY(0.4); }
  50% { transform: scaleY(1); }
}

/* ── GLOBAL MOBILE / TABLET RESPONSIVE (2026 pass) ── */
img, video { max-width: 100%; height: auto; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { -webkit-tap-highlight-color: transparent; overscroll-behavior-y: none; }

@media (max-width: 1024px) {
  /* Tablet: tighten horizontal padding */
  section { padding-left: 20px !important; padding-right: 20px !important; }
}

@media (max-width: 768px) {
  /* Nav already handles hamburger via .ham class */

  /* Grid → single column on mobile */
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns: repeat(3"],
  [style*="grid-template-columns:repeat(3"] {
    grid-template-columns: 1fr !important;
  }
  [style*="grid-template-columns: repeat(2"],
  [style*="grid-template-columns:repeat(2"] {
    grid-template-columns: 1fr !important;
  }

  /* Hero heights — svh so the mobile URL bar never crops content */
  [style*="height: 65vh"] { height: 56svh !important; }
  [style*="height: 100vh"] { height: 86svh !important; }
  [style*="minHeight: 90vh"] { min-height: 72svh !important; }
  [style*="minHeight: 80vh"] { min-height: 66svh !important; }

  /* Display type — big, confident, tight leading */
  h1, h2 { font-size: clamp(1.9rem, 8.4vw, 3rem) !important; line-height: 1.15 !important; }

  /* Flex layouts → column on mobile */
  [style*="display: flex"][style*="gap: 32"],
  [style*="display:flex"][style*="gap:32"] {
    flex-wrap: wrap !important;
  }

  /* Padding tighten */
  [style*="padding: 96px"] { padding: 56px 20px !important; }
  [style*="padding: 80px"] { padding: 52px 20px !important; }
  [style*="padding: 72px"] { padding: 44px 20px !important; }
  [style*="padding: 64px"] { padding: 40px 20px !important; }

  /* Max-width panels */
  [style*="maxWidth: 560"],
  [style*="maxWidth: 720"],
  [style*="maxWidth: 900"],
  [style*="maxWidth: 1100"],
  [style*="maxWidth: 1300"] {
    max-width: 100% !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

@media (max-width: 480px) {
  /* Extra small phones */
  [style*="padding: 48px 40px"] { padding: 32px 20px !important; }
  [style*="fontSize: 22"] { font-size: 17px !important; }
  [style*="gap: 20"] { gap: 12px !important; }
  [style*="gap: 24"] { gap: 12px !important; }
  [style*="gap: 32"] { gap: 16px !important; }
}

/* Touch targets */
@media (hover: none) and (pointer: coarse) {
  button, a { min-height: 44px; min-width: 44px; }
  input, textarea { font-size: 16px !important; } /* prevent iOS zoom */
}

/* Safe area for notched phones */
@supports (padding: max(0px)) {
  body {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
  }
}