@charset "utf-8";
/* CSS Document */

:root{
      --brand: #0176B1;
      --brand-light: #01A3F2;
      --brand-600: #0176B1;
      --brand-700: #0170AA;
      --ink: #0a2540;
      --bg: #f7f9fc;
      --cardCDG: #ffffff;
      --muted: #777777;
      --warn: #f59e0b;
      --shadow: 0 18px 40px -18px rgba(0,0,0,.2);
    }

    *{box-sizing:border-box;}
    body{margin:0;font-family:'Inter',system-ui;color:var(--ink);background:var(--bg);}
    .hero{
      position:relative;
      background:linear-gradient(110deg, rgba(0,113,227,.35), rgba(255,255,255,0.9)), url('../images/title-center-heading2.jpg');
      background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
      border-bottom:1px solid #e8eef6;
      display:flex;
      align-items:center;
      justify-content:center;
      text-align:center;
      padding:8rem 1rem 9rem;
    }
    .hero-content{
      /* CDGEDIT  max-width:780px; */
      background:rgba(255,255,255,0.95);
      backdrop-filter:blur(12px);
      border-radius:20px;
      padding:3rem 2.5rem;
      box-shadow:0 25px 60px -25px rgba(0,0,0,0.25);
      border:1px solid rgba(0,113,227,.25);
    }

    h1{
      margin:0;font-size:clamp(2.6rem,4vw,3.8rem);line-height:1.04;background:linear-gradient(90deg,var(--brand-700),#0094ff);-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-weight:900;letter-spacing:-.01em;text-shadow:0 2px 6px rgba(0,0,0,0.1);
    }

    .lead{
      margin:1.3rem auto 0;color:var(--muted);font-size:1.2rem;max-width:62ch;font-weight:500;
    }

    .hero-cardCDG{
      position:absolute;
      right:6%;
      bottom:-70px;
      background:#0a2540;
      color:#d5e4ff;
      border:1px solid #153a60;
      border-radius:20px;
      padding:1.5rem;
      box-shadow:var(--shadow);
      width:330px;
    }

    .hero-cardCDG h3{margin:.2rem 0 .6rem;font-size:1.15rem;color:#cfe1ff;text-align:left;}
    .hero-cardCDG ul{list-style:none;padding:0;margin:0;display:grid;gap:.5rem;text-align:left;}
    .hero-cardCDG li{display:flex;gap:.6rem;align-items:flex-start;}
    .hero-cardCDG .dot{width:8px;height:8px;margin-top:.6rem;border-radius:999px;background:#64b5ff;}
    section{padding:8rem 0 3.25rem;}
    .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:1.25rem;}
    .col-6CDG{grid-column:span 6;}
    .col-12CDG{grid-column:span 12;}

/* 1720px and down — stack, center card, overlap only below */
@media (max-width: 1719px) {

  .hero {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 6rem 1rem 11rem; /* extra bottom space for overlap */
  }

  .hero-content {
    max-width: 780px;
    margin: 0 auto;
    z-index: 2; /* ensure card doesn't cover headline */
  }

  .hero-cardCDG {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    right: auto;
    bottom: -90px;
    width: 360px;
    z-index: 3;
  }
}

/* Under 900px — remove overlap entirely */
@media (max-width: 900px) {

  .hero {
    padding: 5rem 1rem 4rem; /* reduce bottom padding */
  }

  .hero-cardCDG {
    position: relative;
    left: auto;
    transform: none;
    bottom: auto;
    width: min(440px, calc(100% - 2rem));
    margin-top: 2rem;
  }
}

    .cardCDG{background:var(--cardCDG);border:1px solid #e8eef6;border-radius:20px;padding:1.25rem 1.2rem;box-shadow:0 10px 26px -20px rgba(2,19,41,.3);}
    .cardCDG h3{margin:.25rem 0 .35rem;font-size:1.25rem;font-weight:700;color:var(--brand-700);}
    .muted{color:var(--muted);}
    ul.clean{margin:.25rem 0 .5rem 1.1rem;}
    ul.clean li{
      margin:.35rem 0;
      list-style-type: disc;
}
    .note{
      background:linear-gradient(135deg, #f4f9ff, #e8f2ff);
      border-left:6px solid var(--brand);
      padding:1.1rem 1.2rem;
      border-radius:14px;
      font-weight:500;
      box-shadow:inset 0 1px 4px rgba(0,0,0,0.05);
      color:var(--ink);
      margin-top:1rem;
    }

    .note strong{color:var(--brand-700);}
    .note--warn{border-left-color:var(--warn);background:#fff7e1;}