/* Playbook landing - DirectAdmin friendly structure
   Notes: Uses Tailwind CDN + custom theme vars to keep original look.
*/

/* Fonts (same as original project) */
@import url('https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/Vazirmatn-font-face.css');
@import url('https://cdn.jsdelivr.net/gh/rastikerdar/iran-sans@v6.0.0/dist/font-face.css');

:root {
  --font-size: 16px;

  /* Original hex vars */
  --background: #0a1810;
  --foreground: #e8f5ed;
  --card: #0f2419;
  --card-foreground: #e8f5ed;
  --primary: #00ff88;
  --primary-foreground: #0a1810;
  --secondary: #1a3d2e;
  --secondary-foreground: #e8f5ed;
  --muted: #14291f;
  --muted-foreground: #8ba89a;
  --accent: #1a5438;
  --accent-foreground: #e8f5ed;
  --destructive: #ff4466;
  --destructive-foreground: #ffffff;
  --border: rgba(0, 255, 136, 0.15);
  --ring: #00ff88;
  --radius: 0.75rem;

  /* RGB component vars for Tailwind alpha support */
  --background-rgb: 10 24 16;
  --foreground-rgb: 232 245 237;
  --card-rgb: 15 36 25;
  --card-foreground-rgb: 232 245 237;
  --primary-rgb: 0 255 136;
  --primary-foreground-rgb: 10 24 16;
  --secondary-rgb: 26 61 46;
  --secondary-foreground-rgb: 232 245 237;
  --muted-rgb: 20 41 31;
  --muted-foreground-rgb: 139 168 154;
  --accent-rgb: 26 84 56;
  --accent-foreground-rgb: 232 245 237;
  --destructive-rgb: 255 68 102;
  --destructive-foreground-rgb: 255 255 255;
  --ring-rgb: 0 255 136;
}

html { font-size: var(--font-size); }
body {
  margin: 0;
  background: var(--background);
  color: var(--foreground);
  font-family: 'IRANSans', 'Vazirmatn', sans-serif;
}

/* Scroll-reveal helpers (replaces motion/react animations) */
.js-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 700ms ease, transform 700ms ease;
  will-change: opacity, transform;
}

.js-reveal[data-anim="scale"] {
  transform: scale(0.9);
}

.js-reveal[data-anim="left"] {
  transform: translateX(-30px);
}

.js-reveal[data-anim="right"] {
  transform: translateX(30px);
}

.js-reveal.is-visible {
  opacity: 1;
  transform: none;
}