@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');
  :root {
      --bg: #ffffff;
      --border: #e2e8f0;
      --radius: 12px;
      --shadow-card: 0 4px 20px -2px rgba(15, 23, 42, 0.06), 0 2px 6px -1px rgba(15, 23, 42, 0.04);
      --shadow-card-hover: 0 20px 35px -5px rgba(15, 23, 42, 0.12), 0 10px 15px -5px rgba(14, 116, 144, 0.08);
      --gradient-brand: linear-gradient(135deg, rgba(14, 116, 144, 0.12) 0%, rgba(3, 105, 161, 0.05) 50%, rgba(245, 158, 11, 0.08) 100%);
      --shadow-glow: 0 0 80px 30px rgba(14, 116, 144, 0.15);
      --shadow-accent: 0 0 60px 20px rgba(245, 158, 11, 0.12);
      --charcoal: #0f172a;
      --muted: #64748b;
      --charcoal-soft: #1e293b;
      --primary: #0e7490;
      --font-family: "Plus Jakarta Sans", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  }

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

  body {
      font-family: var(--font-family);
      background-color: #f8fafc;
      color: var(--charcoal);
      line-height: 1.5;
      -webkit-font-smoothing: antialiased;
  }

  /* ==========================================================================
       AWARDS & RECOGNITION SECTION STYLES
       ========================================================================== */
  .awards-section {
      position: relative;
      width: 100%;
      padding: 100px 24px;
      background-color: var(--bg);
      overflow: hidden;
      isolation: isolate;
  }

  /* Container for layout alignment */
  .awards-container {
      max-width: 1440px;
      margin: 0 auto;
      position: relative;
      z-index: 2;
  }

  /* --------------------------------------------------------------------------
       DECORATIVE BACKGROUND ELEMENTS (CSS-Only)
       -------------------------------------------------------------------------- */
  .awards-bg-decor {
      position: absolute;
      inset: 0;
      pointer-events: none;
      z-index: 1;
      overflow: hidden;
  }

  .awards-blob {
      position: absolute;
      border-radius: 50%;
      filter: blur(80px);
      opacity: 0.7;
  }

  .awards-blob-1 {
      top: -100px;
      left: -100px;
      width: 500px;
      height: 500px;
      background: var(--gradient-brand);
      box-shadow: var(--shadow-glow);
  }

  .awards-blob-2 {
      bottom: -150px;
      right: -100px;
      width: 600px;
      height: 600px;
      background: var(--gradient-brand);
      box-shadow: var(--shadow-accent);
      transform: rotate(180deg);
  }

  .awards-blob-3 {
      top: 40%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 700px;
      height: 400px;
      background: var(--gradient-brand);
      filter: blur(120px);
      opacity: 0.4;
  }

  /* Subtle Geometric Grid Lines for High-Tech / Industrial Feel */
  .awards-grid-pattern {
      position: absolute;
      inset: 0;
      background-image:
          linear-gradient(to right, rgba(148, 163, 184, 0.05) 1px, transparent 1px),
          linear-gradient(to bottom, rgba(148, 163, 184, 0.05) 1px, transparent 1px);
      background-size: 60px 60px;
      mask-image: radial-gradient(circle at 50% 50%, black 30%, transparent 80%);
      -webkit-mask-image: radial-gradient(circle at 50% 50%, black 30%, transparent 80%);
  }

  /* --------------------------------------------------------------------------
       HEADER STYLES
       -------------------------------------------------------------------------- */
  .awards-header {
      text-align: center;
      max-width: 800px;
      margin: 0 auto 60px auto;
  }

  .awards-label-wrapper {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 16px;
  }

  .awards-label-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background-color: var(--primary);
      box-shadow: 0 0 10px var(--primary);
  }

  .awards-small-label {
      font-size: 0.85rem;
      font-weight: 700;
      letter-spacing: 0.15em;
      text-transform: uppercase;
      color: var(--primary);
  }

  .awards-main-heading {
      font-size: clamp(2.25rem, 4vw, 3.25rem);
      font-weight: 800;
      line-height: 1.15;
      color: var(--charcoal);
      margin-bottom: 20px;
      letter-spacing: -0.02em;
  }

  .awards-description {
      font-size: clamp(1rem, 1.25vw, 1.15rem);
      line-height: 1.65;
      color: var(--muted);
      max-width: 720px;
      margin: 0 auto;
      font-weight: 400;
  }

  /* --------------------------------------------------------------------------
       AWARDS GRID
       -------------------------------------------------------------------------- */
  .awards-grid {
      display: grid;
      gap: 30px;
      width: 100%;
      /* Default 5 columns for Desktop 1400px+ */
      grid-template-columns: repeat(3, 1fr);
  }

  /* --------------------------------------------------------------------------
       CARD DESIGN & HOVER EFFECTS
       -------------------------------------------------------------------------- */
  .award-card {
      background-color: var(--bg);
      border: 1px solid var(--border);
      border-radius: var(--radius);
      box-shadow: var(--shadow-card);
      overflow: hidden;
      display: flex;
      flex-direction: column;
      height: 100%;
      text-decoration: none;
      position: relative;
      cursor: pointer;
      transition:
          transform 0.4s cubic-bezier(0.16, 1, 0.3, 1),
          box-shadow 0.4s cubic-bezier(0.16, 1, 0.3, 1),
          border-color 0.4s ease,
          opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  }

  /* Card Hover State */
  .award-card:hover {
      transform: translateY(-10px);
      box-shadow: var(--shadow-card-hover);
      border-color: rgba(14, 116, 144, 0.3);
  }

  /* Image Wrapper with 4:3 Ratio */
  .award-image-wrapper {
      position: relative;
      width: 100%;
      aspect-ratio: 4 / 5;
      overflow: hidden;
      background-color: #f1f5f9;
  }

  .award-image {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
  }

  /* Image Zoom on Hover */
  .award-card:hover .award-image {
      transform: scale(1.08);
  }

  /* Image Subtle Glass Overlay Badge */
  .award-badge-pill {
      position: absolute;
      top: 12px;
      right: 12px;
      background: rgba(255, 255, 255, 0.85);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
      border: 1px solid rgba(255, 255, 255, 0.5);
      border-radius: 20px;
      padding: 4px 10px;
      font-size: 0.72rem;
      font-weight: 700;
      color: var(--charcoal);
      letter-spacing: 0.05em;
      text-transform: uppercase;
      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
      pointer-events: none;
  }

  /* Card Content Area */
  .award-content {
      padding: 22px 20px 24px 20px;
      display: flex;
      flex-direction: column;
      flex-grow: 1;
      justify-content: space-between;
  }

  .award-title {
      font-size: 1.05rem;
      font-weight: 700;
      line-height: 1.4;
      color: var(--charcoal-soft);
      margin-bottom: 12px;
      transition: color 0.4s ease;
  }

  /* Title Color Transition on Hover */
  .award-card:hover .award-title {
      color: var(--primary);
  }

  .award-footer-line {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-top: auto;
      padding-top: 14px;
      border-top: 1px solid rgba(226, 232, 240, 0.6);
  }

  .award-year {
      font-size: 0.8rem;
      font-weight: 600;
      color: var(--muted);
      letter-spacing: 0.02em;
  }

  .award-arrow-icon {
      width: 18px;
      height: 18px;
      color: var(--muted);
      transition: transform 0.4s ease, color 0.4s ease;
  }

  .award-card:hover .award-arrow-icon {
      color: var(--primary);
      transform: translateX(4px);
  }

  /* --------------------------------------------------------------------------
       SCROLL ANIMATION STATES (Intersection Observer)
       -------------------------------------------------------------------------- */
  .award-animate {
      opacity: 0;
      transform: translateY(35px);
      will-change: opacity, transform;
  }

  .award-animate.is-visible {
      opacity: 1;
      transform: translateY(0);
  }

  /* Stagger Animation Delays */
  .awards-grid .award-card:nth-child(1) {
      transition-delay: 0.05s;
  }

  .awards-grid .award-card:nth-child(2) {
      transition-delay: 0.12s;
  }

  .awards-grid .award-card:nth-child(3) {
      transition-delay: 0.19s;
  }

  .awards-grid .award-card:nth-child(4) {
      transition-delay: 0.26s;
  }

  .awards-grid .award-card:nth-child(5) {
      transition-delay: 0.33s;
  }

  .awards-grid .award-card:nth-child(6) {
      transition-delay: 0.10s;
  }

  .awards-grid .award-card:nth-child(7) {
      transition-delay: 0.17s;
  }

  .awards-grid .award-card:nth-child(8) {
      transition-delay: 0.24s;
  }

  .awards-grid .award-card:nth-child(9) {
      transition-delay: 0.31s;
  }

  .awards-grid .award-card:nth-child(10) {
      transition-delay: 0.38s;
  }

  /* --------------------------------------------------------------------------
       RESPONSIVE BREAKPOINTS
       -------------------------------------------------------------------------- */

  /* 2560px & 4K Ultra-Wide Support */
  @media (min-width: 1921px) {
      .awards-container {
          max-width: 1800px;
      }

      .awards-grid {
          gap: 36px;
      }
  }

  /* Desktop Standard: 1400px - 1920px (Default 5 columns) */
  @media (min-width: 1400px) and (max-width: 1920px) {
      .awards-grid {
          grid-template-columns: repeat(3, 1fr);
      }
  }

  /* Laptop: 992px - 1399px (4 Columns) */
  @media (max-width: 1399px) {
      .awards-grid {
          grid-template-columns: repeat(3, 1fr);
          gap: 24px;
      }

      .awards-section {
          padding: 80px 20px;
      }
  }

  /* Tablet: 576px - 991px (2 Columns) */
  @media (max-width: 991px) {
      .awards-grid {
          grid-template-columns: repeat(2, 1fr);
          gap: 24px;
      }

      .awards-header {
          margin-bottom: 48px;
      }
  }

  /* Mobile: <576px (1 Column) */
  @media (max-width: 575px) {
      .awards-grid {
          grid-template-columns: repeat(1, 1fr);
          gap: 20px;
      }

      .awards-section {
          padding: 60px 16px;
      }

      .awards-main-heading {
          margin-bottom: 14px;
      }

      .award-content {
          padding: 18px 16px 20px 16px;
      }
  }

  /* Extra Small Screen 320px - 375px Fixes */
  @media (max-width: 375px) {
      .awards-section {
          padding: 50px 12px;
      }

      .awards-grid {
          gap: 16px;
      }
  }

  /* Reduced Motion Preference for Accessibility */
  @media (prefers-reduced-motion: reduce) {

      .award-card,
      .award-image,
      .award-title,
      .award-arrow-icon {
          transition: none !important;
      }

      .award-animate {
          opacity: 1 !important;
          transform: none !important;
      }
  }