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

    body {
      font-family: 'Outfit', sans-serif;
      background: #0a0a0a;
      color: #e5e5e5;
      line-height: 1.7;
      overflow-x: hidden;
    }

    /* Custom properties */
    :root {
      --primary: #ff3b3b;
      --primary-dark: #cc0000;
      --accent: #ffd700;
      --dark: #0a0a0a;
      --dark-surface: #151515;
      --dark-elevated: #1f1f1f;
      --text-muted: #a0a0a0;
      --border: rgba(255, 255, 255, 0.08);
    }

    /* Typography */
    .display-font {
      font-family: 'Bebas Neue', sans-serif;
      letter-spacing: 0.02em;
    }

    /* Animated gradient background */
    .hero-bg {
      background: 
        radial-gradient(circle at 20% 30%, rgba(255, 59, 59, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(255, 215, 0, 0.1) 0%, transparent 50%),
        linear-gradient(135deg, #0a0a0a 0%, #151515 100%);
      position: relative;
    }

    .hero-bg::before {
      content: '';
      position: absolute;
      inset: 0;
      background: 
        repeating-linear-gradient(
          0deg,
          transparent,
          transparent 2px,
          rgba(255, 255, 255, 0.01) 2px,
          rgba(255, 255, 255, 0.01) 4px
        );
      pointer-events: none;
    }

    /* Glowing border effect */
    .glow-border {
      position: relative;
      border: 1px solid var(--border);
      background: var(--dark-elevated);
    }

    .glow-border::before {
      content: '';
      position: absolute;
      inset: -1px;
      border-radius: inherit;
      padding: 1px;
      background: linear-gradient(135deg, var(--primary), transparent, var(--accent));
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      opacity: 0;
      transition: opacity 0.3s ease;
    }

    .glow-border:hover::before {
      opacity: 0.5;
    }

    /* Stat counter animation */
    .stat-box {
      background: linear-gradient(135deg, var(--dark-elevated) 0%, var(--dark-surface) 100%);
      border: 1px solid var(--border);
      position: relative;
      overflow: hidden;
    }

    .stat-box::after {
      content: '';
      position: absolute;
      top: 0;
      left: -100%;
      width: 100%;
      height: 2px;
      background: linear-gradient(90deg, transparent, var(--primary), transparent);
      animation: shimmer 3s infinite;
    }

    @keyframes shimmer {
      100% { left: 100%; }
    }

    /* Badge styles */
    .badge {
      display: inline-block;
      padding: 0.5rem 1rem;
      background: rgba(255, 255, 255, 0.05);
      border: 1px solid var(--border);
      border-radius: 2rem;
      font-size: 0.875rem;
      font-weight: 500;
      backdrop-filter: blur(10px);
    }

    .badge-primary {
      background: linear-gradient(135deg, var(--primary), var(--primary-dark));
      border-color: var(--primary);
      color: white;
      box-shadow: 0 4px 20px rgba(255, 59, 59, 0.3);
    }

    /* Service card */
    .service-card {
      background: var(--dark-elevated);
      border: 1px solid var(--border);
      border-radius: 1rem;
      padding: 2rem;
      transition: all 0.3s ease;
      position: relative;
      overflow: hidden;
    }

    .service-card::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 3px;
      background: linear-gradient(90deg, var(--primary), var(--accent));
      transform: scaleX(0);
      transition: transform 0.3s ease;
    }

    .service-card:hover {
      transform: translateY(-4px);
      border-color: rgba(255, 59, 59, 0.3);
      box-shadow: 0 10px 40px rgba(255, 59, 59, 0.1);
    }

    .service-card:hover::before {
      transform: scaleX(1);
    }

    /* Technique grid */
    .technique-item {
      background: var(--dark-surface);
      border: 1px solid var(--border);
      border-radius: 0.75rem;
      padding: 1.5rem;
      transition: all 0.3s ease;
    }

    .technique-item:hover {
      background: var(--dark-elevated);
      border-color: var(--primary);
      transform: scale(1.02);
    }

    /* Timeline */
    .timeline-item {
      position: relative;
      padding-left: 2.5rem;
      padding-bottom: 2rem;
      border-left: 2px solid var(--border);
    }

    .timeline-item::before {
      content: '';
      position: absolute;
      left: -6px;
      top: 0;
      width: 10px;
      height: 10px;
      border-radius: 50%;
      background: var(--primary);
      box-shadow: 0 0 0 4px var(--dark), 0 0 10px var(--primary);
    }

    .timeline-item:last-child {
      border-left-color: transparent;
    }

    /* Button styles */
    .btn {
      display: inline-flex;
      align-items: center;
      gap: 0.5rem;
      padding: 1rem 2rem;
      border-radius: 0.5rem;
      font-weight: 600;
      text-decoration: none;
      transition: all 0.3s ease;
      cursor: pointer;
      border: none;
    }

    .btn-primary {
      background: linear-gradient(135deg, var(--primary), var(--primary-dark));
      color: white;
      box-shadow: 0 4px 20px rgba(255, 59, 59, 0.3);
    }

    .btn-primary:hover {
      transform: translateY(-2px);
      box-shadow: 0 6px 30px rgba(255, 59, 59, 0.4);
    }

    .btn-outline {
      background: transparent;
      color: var(--accent);
      border: 2px solid var(--accent);
    }

    .btn-outline:hover {
      background: var(--accent);
      color: var(--dark);
    }

    /* Risk matrix */
    .risk-cell {
      background: var(--dark-surface);
      border: 1px solid var(--border);
      border-radius: 0.5rem;
      padding: 1rem;
      text-align: center;
      transition: all 0.3s ease;
    }

    .risk-cell:hover {
      background: var(--dark-elevated);
      transform: scale(1.05);
    }

    /* Floating elements */
    @keyframes float {
      0%, 100% { transform: translateY(0px); }
      50% { transform: translateY(-20px); }
    }

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

    /* Pulse animation for CTA */
    @keyframes pulse {
      0%, 100% { box-shadow: 0 0 0 0 rgba(255, 59, 59, 0.7); }
      50% { box-shadow: 0 0 0 20px rgba(255, 59, 59, 0); }
    }

    .pulse-animation {
      animation: pulse 2s infinite;
    }

    /* FAQ accordion */
    details {
      background: var(--dark-elevated);
      border: 1px solid var(--border);
      border-radius: 0.75rem;
      padding: 1.5rem;
      margin-bottom: 1rem;
      transition: all 0.3s ease;
    }

    details[open] {
      background: var(--dark-surface);
      border-color: var(--primary);
    }

    summary {
      font-weight: 600;
      cursor: pointer;
      list-style: none;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    summary::after {
      content: '+';
      font-size: 1.5rem;
      color: var(--primary);
      transition: transform 0.3s ease;
    }

    details[open] summary::after {
      transform: rotate(45deg);
    }

    /* Responsive design */
    @media (max-width: 768px) {
      .display-font { font-size: 2rem; }
      .service-card { padding: 1.5rem; }
    }

    /* Smooth scrolling */
    html {
      scroll-behavior: smooth;
    }

    /* Scrollbar styling */
    ::-webkit-scrollbar {
      width: 10px;
    }

    ::-webkit-scrollbar-track {
      background: var(--dark);
    }

    ::-webkit-scrollbar-thumb {
      background: var(--primary);
      border-radius: 5px;
    }

    ::-webkit-scrollbar-thumb:hover {
      background: var(--accent);
    }

    /* ============================================
       TECHNIQUES SECTION ANIMATIONS
       ============================================ */
    
    /* Particle background animation */
    .particles-container {
      position: absolute;
      inset: 0;
      overflow: hidden;
      pointer-events: none;
    }

    .particles-container::before,
    .particles-container::after {
      content: '';
      position: absolute;
      width: 300px;
      height: 300px;
      border-radius: 50%;
      filter: blur(80px);
      animation: float-particle 20s ease-in-out infinite;
    }

    .particles-container::before {
      background: rgba(255, 59, 59, 0.15);
      top: 10%;
      left: -10%;
      animation-delay: 0s;
    }

    .particles-container::after {
      background: rgba(255, 215, 0, 0.15);
      bottom: 10%;
      right: -10%;
      animation-delay: 5s;
    }

    @keyframes float-particle {
      0%, 100% { transform: translate(0, 0) scale(1); }
      33% { transform: translate(100px, -100px) scale(1.2); }
      66% { transform: translate(-50px, 50px) scale(0.9); }
    }

    /* Text slide in animation */
    .text-slide {
      display: inline-block;
      opacity: 0;
      transform: translateY(-30px);
      animation: slideInDown 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
    }

    @keyframes slideInDown {
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    /* Fade in up animation */
    .fade-in-up {
      opacity: 0;
      transform: translateY(30px);
      animation: fadeInUp 1s ease-out forwards;
    }

    @keyframes fadeInUp {
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    /* Risk cell animation */
    .risk-animate {
      opacity: 0;
      transform: scale(0.8) translateY(20px);
      animation: riskPopIn 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
    }

    @keyframes riskPopIn {
      to {
        opacity: 1;
        transform: scale(1) translateY(0);
      }
    }

    /* Risk pulse effect */
    .risk-pulse {
      animation: riskPulse 2s ease-in-out infinite;
    }

    @keyframes riskPulse {
      0%, 100% { 
        transform: scale(1);
        opacity: 1;
      }
      50% { 
        transform: scale(1.1);
        opacity: 0.8;
      }
    }

    /* Technique card entrance */
    .technique-card-animate {
      opacity: 0;
      transform: translateX(-50px) rotateY(-10deg);
      animation: cardSlideIn 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
    }

    @keyframes cardSlideIn {
      to {
        opacity: 1;
        transform: translateX(0) rotateY(0);
      }
    }

    /* Icon bounce animation */
    .icon-bounce {
      display: inline-block;
      animation: iconBounce 2s ease-in-out infinite;
    }

    @keyframes iconBounce {
      0%, 100% { transform: translateY(0) rotate(0deg); }
      25% { transform: translateY(-10px) rotate(-5deg); }
      75% { transform: translateY(-5px) rotate(5deg); }
    }

    /* Workflow item slide in */
    .workflow-item {
      opacity: 0;
      transform: translateX(-20px);
      animation: workflowSlide 0.5s ease-out forwards;
    }

    @keyframes workflowSlide {
      to {
        opacity: 1;
        transform: translateX(0);
      }
    }

    /* Star pop animation */
    .star-pop {
      display: inline-block;
      opacity: 0;
      transform: scale(0) rotate(-180deg);
      animation: starPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
    }

    @keyframes starPop {
      to {
        opacity: 1;
        transform: scale(1) rotate(0deg);
      }
    }

    /* Warning shake */
    .warning-shake {
      display: inline-block;
      opacity: 0;
      animation: warningShake 0.8s ease-out forwards;
    }

    @keyframes warningShake {
      0% { 
        opacity: 0;
        transform: translateX(-10px);
      }
      25% { transform: translateX(10px); }
      50% { transform: translateX(-5px); }
      75% { transform: translateX(5px); }
      100% { 
        opacity: 1;
        transform: translateX(0);
      }
    }

    /* Cloak flip animation */
    .cloak-flip {
      opacity: 0;
      transform: perspective(1000px) rotateX(-90deg);
      animation: cloakFlip 0.6s ease-out forwards;
    }

    @keyframes cloakFlip {
      to {
        opacity: 1;
        transform: perspective(1000px) rotateX(0deg);
      }
    }

    /* ============================================
       WHY INDIA SECTION ANIMATIONS
       ============================================ */

    /* India flag colors animated background */
    .india-bg-animate {
      position: absolute;
      inset: 0;
      background: 
        linear-gradient(
          0deg,
          rgba(255, 153, 51, 0.05) 0%,
          transparent 33%,
          transparent 66%,
          rgba(19, 136, 8, 0.05) 100%
        );
      opacity: 0;
      animation: indiaFlagFade 3s ease-in forwards;
    }

    @keyframes indiaFlagFade {
      to { opacity: 1; }
    }

    /* India title special effect */
    .india-title {
      background: linear-gradient(
        45deg,
        #ff9933,
        #ffffff,
        #138808
      );
      background-size: 200% 200%;
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      animation: indiaGradient 3s ease infinite;
    }

    @keyframes indiaGradient {
      0% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
      100% { background-position: 0% 50%; }
    }

    /* India card animation */
    .india-card-animate {
      opacity: 0;
      transform: translateY(50px) scale(0.9);
      animation: indiaCardRise 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
    }

    @keyframes indiaCardRise {
      to {
        opacity: 1;
        transform: translateY(0) scale(1);
      }
    }

    /* Icon rotation */
    .icon-rotate {
      display: inline-block;
      animation: iconRotate 4s ease-in-out infinite;
    }

    @keyframes iconRotate {
      0%, 100% { transform: rotate(0deg) scale(1); }
      25% { transform: rotate(-10deg) scale(1.1); }
      50% { transform: rotate(10deg) scale(1); }
      75% { transform: rotate(-5deg) scale(1.1); }
    }

    /* Price counter effect */
    .price-counter {
      display: inline-block;
      animation: priceGlow 2s ease-in-out infinite;
    }

    @keyframes priceGlow {
      0%, 100% { 
        text-shadow: 0 0 5px rgba(34, 197, 94, 0.5);
      }
      50% { 
        text-shadow: 0 0 20px rgba(34, 197, 94, 0.8),
                     0 0 30px rgba(34, 197, 94, 0.4);
      }
    }

    /* Expertise tag animation */
    .expertise-tag {
      display: inline-block;
      padding: 0.35rem 0.75rem;
      background: linear-gradient(135deg, rgba(255, 59, 59, 0.2), rgba(255, 215, 0, 0.2));
      border: 1px solid rgba(255, 59, 59, 0.3);
      border-radius: 1rem;
      font-size: 0.75rem;
      opacity: 0;
      transform: scale(0);
      animation: tagPop 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
    }

    @keyframes tagPop {
      to {
        opacity: 1;
        transform: scale(1);
      }
    }

    .expertise-tag:hover {
      background: linear-gradient(135deg, rgba(255, 59, 59, 0.4), rgba(255, 215, 0, 0.4));
      transform: scale(1.05);
      transition: all 0.3s ease;
    }

    /* Clock animation */
    .clock-animation {
      animation: clockPulse 2s ease-in-out infinite;
    }

    @keyframes clockPulse {
      0%, 100% {
        transform: scale(1);
        filter: brightness(1);
      }
      50% {
        transform: scale(1.05);
        filter: brightness(1.2);
      }
    }

    /* Use case floating animation */
    .use-case-float {
      opacity: 0;
      animation: useCaseFloat 1s ease-out forwards,
                 floatContinuous 3s ease-in-out infinite;
    }

    @keyframes useCaseFloat {
      to {
        opacity: 1;
      }
    }

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

    /* Hover effect enhancements for technique items */
    .technique-item:hover {
      animation: itemShake 0.5s ease;
    }

    @keyframes itemShake {
      0%, 100% { transform: translateX(0); }
      25% { transform: translateX(-5px) rotate(-1deg); }
      75% { transform: translateX(5px) rotate(1deg); }
    }

    /* Glow border enhanced hover */
    .glow-border:hover {
      box-shadow: 
        0 0 20px rgba(255, 59, 59, 0.3),
        0 0 40px rgba(255, 59, 59, 0.1),
        inset 0 0 20px rgba(255, 59, 59, 0.05);
      transition: all 0.3s ease;
    }

    /* Service card enhanced animation on hover */
    .service-card {
      transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    }

    .service-card:hover {
      transform: translateY(-8px) scale(1.02);
    }

    /* Add scanning line effect to risk matrix */
    .risk-cell::after {
      content: '';
      position: absolute;
      top: -2px;
      left: 0;
      right: 0;
      height: 2px;
      background: linear-gradient(90deg, 
        transparent,
        rgba(255, 59, 59, 0.5),
        transparent
      );
      animation: scanLine 3s linear infinite;
    }

    @keyframes scanLine {
      from { transform: translateY(0); }
      to { transform: translateY(100px); }
    }