/* Wrapper stylesheet to keep compatibility with css/styles.css paths.
   The actual theme lives in /static/main.css. */

@import url("../main.css");

/* =========================
    Premium Hero Background
    ========================= */

.hero {
   position: relative;
   overflow: hidden;
   border-bottom: 1px solid var(--border);

   /* Layered gradient for depth */
   background:
      radial-gradient(
         900px 400px at 10% 10%,
         rgba(24, 32, 48, 0.18),
         transparent 60%
      ),
      radial-gradient(
         1000px 500px at 90% 0%,
         rgba(70, 120, 200, 0.18),
         transparent 60%
      ),
      linear-gradient(
         180deg,
         #f8fafc 0%,
         #eef2f7 40%,
         #e6ebf2 100%
      );
}

/* ---------- Section separation (optional) ---------- */
.section-alt {
   background: linear-gradient(180deg, #ffffff 0%, #f9fafb 100%);
   border-top: 1px solid var(--border);
}

/* ---------- Hero image card (subtle glow) ---------- */
.hero-card {
   position: relative;
   background: rgba(255, 255, 255, 0.85);
   backdrop-filter: blur(12px);
   border-radius: var(--radius);
   padding: 24px;
   box-shadow: 0 20px 40px rgba(15, 23, 42, 0.15);
   border: 1px solid rgba(255, 255, 255, 0.4);
}