/* Custom styles for the demo site */
:root{
  --hero-bg: linear-gradient(135deg,#4f46e5 0%, #06b6d4 100%);
}
body{
  display:flex;
  flex-direction:column;
  min-height:100vh;
  background-image: url("../assets/fullscreen.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}
.hero{background:var(--hero-bg);}
.hero .lead{opacity:0.95}
.navbar-brand img{filter: drop-shadow(0 1px 0 rgba(0,0,0,0.05));
border-radius: 50%;
}
footer{margin-top:auto}

/* Small utilities */
.container code{background:#f8f9fa;padding:.2rem .4rem;border-radius:.25rem}

 /* Smooth fade-in for hero text */
    .fade-in {
      animation: fadeInUp 1.5s ease-in-out;
    }
    @keyframes fadeInUp {
      from { opacity: 0; transform: translateY(30px); }
      to { opacity: 1; transform: translateY(0); }
    }

    /* Hover effect for cards */
    .card:hover {
      transform: translateY(-10px);
      transition: all 0.3s ease;
      box-shadow: 0 8px 20px rgba(0,0,0,0.2);
    }

    /* Button hover glow */
    .btn-primary:hover {
      box-shadow: 0 0 15px rgba(0,123,255,0.6);
    }
    .btn-outline-light:hover {
      background-color: #fff;
      color: #000;
      transition: all 0.3s ease;
    }

    /* Footer link hover */
    footer a:hover {
      text-decoration: underline;
      color: #0d6efd;
    }
    /* Parallax Hero Section */
.hero-section {
  background-image: url('../assets/hbo.jpg'); /* Replace with your background image */
  background-attachment: fixed;   /* Key for parallax */
  background-size: cover;
  background-position: center;
  position: relative;
}
.hero-section::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,0,0,0.6);    /* Dark overlay for readability */
}
.hero-section .container {
  position: relative;
  z-index: 2;                     /* Keep text above overlay */
}
        /* Hover effect for cards */
    .card:hover {
      transform: translateY(-10px);
      transition: all 0.3s ease;
      box-shadow: 0 8px 20px rgba(0,0,0,0.2);
    }
    /* Button hover glow */
    .btn-primary:hover {
      box-shadow: 0 0 15px rgba(0,123,255,0.6);
    }
    .btn-outline-light:hover {
      background-color: #fff;
      color: #000;
      transition: all 0.3s ease;
    }
    /* Footer link hover */
    footer a:hover {
      text-decoration: underline;
      color: #0d6efd;
    }