/* Import Poppins and Roboto fonts */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap");


/* Styling for the header logo */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Poppins", sans-serif;
}

/* ================= BODY BACKGROUND ONLY ================= */
body {
 /* Base dark teal */
  background-color: #013636;  /* dark teal */

  /* Smooth wavy gradient from dark teal → light teal */
  background-image: radial-gradient(
    circle at 20% 20%,   /* origin of gradient */
    #014d4d 0%,          /* dark teal */
    #017373 50%,         /* medium teal */
    #32c8c8 100%         /* light teal */
  );  background-repeat: no-repeat;
  background-size: cover;
}
.navbar {
  background:
    radial-gradient(circle at top left,
      rgba(0, 0, 0, 0.04),
      transparent 45%),
    radial-gradient(circle at bottom right,
      rgba(0, 0, 0, 0.035),
      transparent 50%),
    linear-gradient(
      180deg,
      #ffffff 0%,
      #f9fafa 100%
    );
    height: 70px;
    padding-top: 25PX;


    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}


.navbar-brand {
  display: flex;
  gap: 10px;
}

.navbar-logo-wrapper {
  display: flex;
  left: -20PX;
}

.navbar-logo {
  height: 200PX;
  width: 400px;
    left: -20PX;

}


/* ================= LUMINET LANDING PAGE HERO ================= */
#luminet-landing-page {

  min-height: 60vh;
  color: white;
  display: flex;
  padding-bottom: 3rem;
  width: 100%;
  padding-top: 20px;
  
}
#ready_to_get_con {
 background-color: #013636;  /* dark teal */

  /* Smooth wavy gradient from dark teal → light teal */
  background-image: radial-gradient(
    circle at 20% 20%,   /* origin of gradient */
    #014d4d 0%,          /* dark teal */
    #017373 50%,         /* medium teal */
    #32c8c8 100%         /* light teal */
  );  background-repeat: no-repeat;
  background-size: cover;
}

/* ================= LUMINET SUPPORT PAGE ================= */

.luminet-support-hero {
  background: radial-gradient(circle at 20% 20%, #014d4d, #017373, #32c8c8);
  color: white;
}

.luminet-support-title {
  font-size: 2.5rem;
}

.luminet-support-subtitle {
  opacity: 0.9;
}

.luminet-support-search input {
  max-width: 600px;
  margin: auto;
}

/* Support cards */
.luminet-support-card {
  border-radius: 12px;
  padding: 2rem;
  background: white;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.luminet-support-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 30px rgba(0,0,0,0.1);
}

.luminet-support-icon {
  font-size: 4.5rem;
  color: #017373;
}

/* Guides */
.luminet-support-guide {
  border-left: 4px solid #017373;
  background: #f8fafa;
  padding: 1.2rem;
  border-radius: 8px;
}

/* Contact */
.luminet-support-contact {
  background: #f4f7f7;
}

.luminet-support-hours {
  border: 2px double #017373;
  padding: 1.5rem;
  border-radius: 10px;
}
/* ================= ONE-STOP POSTER BACKGROUND ================= */

.luminet-support-one-stop {
  position: relative;
  background:
    radial-gradient(circle at 15% 20%, rgba(0, 0, 0, 0.04), transparent 40%),
    radial-gradient(circle at 85% 30%, rgba(0, 0, 0, 0.03), transparent 45%),
    radial-gradient(circle at 50% 80%, rgba(0, 0, 0, 0.02), transparent 50%),
    linear-gradient(180deg, #ffffff 0%, #f5f6f7 100%);
  overflow: hidden;
}

/* Soft abstract shapes */
.luminet-support-one-stop::before,
.luminet-support-one-stop::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.03);
  z-index: 0;
}

.luminet-support-one-stop::before {
  width: 420px;
  height: 420px;
  top: -120px;
  left: -120px;
}

.luminet-support-one-stop::after {
  width: 320px;
  height: 320px;
  bottom: -100px;
  right: -80px;
}

/* Keep content above background */
.luminet-support-one-stop .container {
  position: relative;
  z-index: 2;
}

/* Title styling */
.luminet-support-one-stop-title {
  font-weight: 800;
  color: #1f2d2d; /* dark grey-teal */
}

/* Highlight box */
.luminet-support-one-stop-box {
  background: transparent;
  border-bottom: 1px double #017373;
  border-radius: 16px;
  padding: 2rem;
}


/* Optional: adjust text spacing for smaller screens */
@media (max-width: 991px) {
  #luminet-landing-page h1 {
    font-size: 2.5rem;
  }
}
#ready_to_get_con p {
  font-size: 1.1rem;
  color: black; /* Light gray for paragraphs */
  line-height: 1.6;
  margin-bottom: 1.5rem;
}


/* ================= DYNAMIC POSTER BASE ================= */
.dynamic-poster-section {
  background: white;
  position: relative;
  overflow: hidden;
}

/* Soft geometric poster accents */
.dynamic-poster-section::before,
.dynamic-poster-section::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: transparent;
  z-index: 0;
  animation: floatPoster 18s ease-in-out infinite;
}

.dynamic-poster-section::before {
  width: 420px;
  height: 420px;
  top: -120px;
  left: -120px;
}

.dynamic-poster-section::after {
  width: 300px;
  height: 300px;
  bottom: -100px;
  right: -100px;
  animation-delay: 6s;
}

/* Content always above background */
.dynamic-poster-section .container {
  position: relative;
  z-index: 2;
}

/* ================= STATS ROW ================= */
/* Dark Teal Headings */
.dynamic-poster-section h2,
.dynamic-poster-section h4,
.dynamic-poster-section h5 {
  font-weight: 700; /* fw-bold */
  color: #014d4d;   /* dark teal */
}


.dynamic-poster-section p {
  color: #6c757d;
}

/* ================= FEATURE CARDS ================= */
.dynamic-poster-section .shadow-sm {
  background: transparent;
  box-shadow: 0 15px 40px rgba(0,0,0,0.04);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  animation: fadeUp 1s ease forwards;
}

.dynamic-poster-section .shadow-sm:hover {
  transform: translateY(-6px);
  box-shadow: 0 30px 60px rgba(0,0,0,0.08);
}

/* ================= EQUIPMENT POSTER ================= */
.dynamic-poster-section img {
  animation: floatPoster 10s ease-in-out infinite;
}

/* ================= CTA CARD ================= */

.dynamic-poster-section .btn-primary {
  background: #111;
  border-color: #111;
}

.dynamic-poster-section .btn-outline-primary {
  color: #111;
  border-color: #111;
}

.dynamic-poster-section .btn-outline-primary:hover {
  background: #111;
  color: ghostwhite;
}

/* ================= ANIMATIONS ================= */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes floatPoster {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-14px);
  }
  100% {
    transform: translateY(0);
  }
}
/* ================= CONTOUR BACKGROUND ================= */
.contour-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
}
.feature-icon {
  font-size: 2.5rem; /* large */
  color: #014d4d;    /* dark teal to match poster theme */
}

/* Contour lines */
.contour-bg path {
  fill: rgba(220, 220, 220, 0.164);
  stroke: rgba(120, 200, 140, 0.08); /* VERY light green */
  stroke-width: 1;
}

/* Slight variation for organic feel */
.contour-bg path:nth-child(3n) {
  stroke-opacity: 0.05;
}

.contour-bg path:nth-child(4n) {
  stroke-opacity: 0.1;
}

/* Optional: ultra-slow drift (can remove if you want static) */
@media (prefers-reduced-motion: no-preference) {
  .contour-bg {
    animation: contourDrift 60s linear infinite;
  }
}

@keyframes contourDrift {
  from {
    transform: translateY(0);
  }
  to {
    transform: translateY(-20px);
  }
}


section h2 {
  border-radius: o;
  font-size: 2.5rem;
  font-weight: 700;
  color: white; /* Bright green for headings */
  margin-bottom: 1rem;
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif, Arial, sans-serif;
}
section p {
  font-size: 1.1rem;
  font-weight: 600;
  color: white; /* Light gray for paragraphs */
  line-height: 1.6;
  margin-bottom: 1.5rem;
}

.text-muted {
  color: white; /* Darker gray for muted text */
  font-weight: 600;

}
footer h6{
  color: teal;
}
.image-flow-section {
  margin-top: 50px;
  padding: 20px;
  background: white;
  padding: 44rem 60px;
  position: relative;
  overflow: hidden;
  
  /* Double border */
  border-radius: 0;
}

.image-flow-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  gap: 4rem;

  /* Double border around image row */
  padding: 20px; /* optional: add inner spacing */
}
/* Heartbeat animation */
@keyframes heartbeat {
  0%, 100% {
    transform: scale(1);
  }
  25% {
    transform: scale(1.1);
  }
  50% {
    transform: scale(1.2);
  }
  75% {
    transform: scale(1.1);
  }
}

/* Apply to the second image */
.image-flow-row .image-wrapper:nth-child(2) img {
  animation: heartbeat 1.5s ease-in-out infinite;
  transform-origin: center center; /* scale from center */
}
/* Background contours */
.contours {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0; /* behind everything */
  pointer-events: none;
}


/* Images */
.image-wrapper img {
  width: 180px;
  border-radius: 0;
  box-shadow: 0 ;
}

/* Arc base */
.arc {
  position: absolute;
  width: 300px;
  height: 80px;
  pointer-events: none;
}

/* Arc positions */
.arc-1 { top: 50px; left: 200px; }
.arc-2 { top: -20px; left: 750px; }

/* Path styling */
.arc path { fill: none; stroke-width: 2; }

/* Dots glow */
.arc circle {
  filter: drop-shadow(0 0 8px currentColor);
}
