html,body{background:var(--paper); color:var(--ink); scroll-behavior:smooth}
  a{text-decoration:none}

  /* Navbar do modelo */
  
  /* HERO com imagem nítida + gradiente para legibilidade */
  .hero{
    margin-top:84px; padding:120px 0 72px; color:#fff;
    background:
      radial-gradient(1000px 500px at 0% 0%, rgba(218,34,42,.25), transparent 60%),
      radial-gradient(1000px 500px at 100% 20%, rgba(199,28,36,.22), transparent 60%),
      linear-gradient(135deg, rgba(20,20,22,.55), rgba(20,20,22,.65)),
      url("img/Company-Profile-ENG11 1.png") center/cover no-repeat;
  }

  /* ====== IMAGEM: sistema único para todos os cards ======
     - Mantém proporção com aspect-ratio
     - Recorte usando object-fit + object-position
     - Overlay para legibilidade do título
     - Hover com leve zoom e realce        */
  .media-wrap{
    position:relative; border-radius:var(--r) var(--r) 0 0; overflow:hidden;
    aspect-ratio: 16/10; background:#e9ecef;
  }
  .media-wrap img{
    width:100%; height:100%; object-fit:cover; object-position:center; display:block;
    transform:scale(1); transition:transform .35s ease;
  }
  .media-wrap[data-pos="top"]   img{ object-position:center top; }
  .media-wrap[data-pos="bottom"]img{ object-position:center bottom; }

  .media-wrap::after{
    content:""; position:absolute; inset:0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.45) 100%);
    pointer-events:none;
  }
  .badge-title{
    position:absolute; left:14px; top:14px; z-index:2;
    background: linear-gradient(135deg, var(--red), var(--red2));
    color:#fff; padding:.5rem .75rem; border-radius:10px; font-weight:800; box-shadow:var(--shadow-sm);
  }

  .glass-card{
    background:#fff; border-radius:var(--r); overflow:hidden; box-shadow:var(--shadow-sm);
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .glass-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow) }
  .course-body{padding:1rem 1.1rem .6rem}
  .course-body p{margin:0;color:var(--muted)}
  .course-meta{display:flex; gap:1rem; align-items:center; padding:.8rem 1.1rem; border-top:1px solid #eee; color:#444}
  .course-meta i{color:var(--red)}

  .section-title{font-weight:900; color:var(--red)}
  .divider{width:84px;height:3px;border-radius:2px;background:var(--red);margin:.5rem auto 1.5rem}

  /* Lista de cursos (Gestão, NEBOSH, Petróleo & Gás) */
  .list-course .list-group-item{
    display:flex; align-items:center; gap:.6rem; padding:.9rem 1rem; border:0; border-bottom:1px dashed #e8e8e8;
    background:#fff;
  }
  .list-course .fa{color:var(--red)}

  /* CTA lateral */
  .side-cta{background:linear-gradient(145deg,#fff,#ffe9ec); border:1px solid #ffd9de; border-radius:var(--r)}

  footer{background:linear-gradient(135deg,var(--red),var(--red2)); color:#fff}

  /* Design tokens */
  :root{
    --red:#da222a; --red2:#c71c24; --ink:#1e2329; --muted:#6b7280;
    --paper:#f7f7f9; --r:16px; --shadow:0 14px 36px rgba(0,0,0,.12); --shadow-sm:0 8px 22px rgba(0,0,0,.08);
  }
  html,body{background:var(--paper); color:var(--ink); scroll-behavior:smooth}
  a{text-decoration:none}

  /* Navbar do modelo */
  .navbar{position:fixed;inset:0 0 auto 0;z-index:10;background:#fff;border-bottom:1px solid #eee}
  .navbar a{font-weight:600;color:#111}
  .navbar .logo{height:64px}

  /* HERO com imagem nítida + gradiente para legibilidade */
  .hero{
    margin-top:84px; padding:120px 0 72px; color:#fff;
    background:
      radial-gradient(1000px 500px at 0% 0%, rgba(218,34,42,.25), transparent 60%),
      radial-gradient(1000px 500px at 100% 20%, rgba(199,28,36,.22), transparent 60%),
      linear-gradient(135deg, rgba(20,20,22,.55), rgba(20,20,22,.65)),
      url("img/hero-formacoes-1920.jpg") center/cover no-repeat;
  }

  /* ====== IMAGEM: sistema único para todos os cards ======
     - Mantém proporção com aspect-ratio
     - Recorte usando object-fit + object-position
     - Overlay para legibilidade do título
     - Hover com leve zoom e realce        */
  .media-wrap{
    position:relative; border-radius:var(--r) var(--r) 0 0; overflow:hidden;
    aspect-ratio: 16/10; background:#e9ecef;
  }
  .media-wrap img{
    width:100%; height:100%; object-fit:cover; object-position:center; display:block;
    transform:scale(1); transition:transform .35s ease;
  }
  .media-wrap[data-pos="top"]   img{ object-position:center top; }
  .media-wrap[data-pos="bottom"]img{ object-position:center bottom; }

  .media-wrap::after{
    content:""; position:absolute; inset:0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.45) 100%);
    pointer-events:none;
  }
  .badge-title{
    position:absolute; left:14px; top:14px; z-index:2;
    background: linear-gradient(135deg, var(--red), var(--red2));
    color:#fff; padding:.5rem .75rem; border-radius:10px; font-weight:800; box-shadow:var(--shadow-sm);
  }

  .glass-card{
    background:#fff; border-radius:var(--r); overflow:hidden; box-shadow:var(--shadow-sm);
    transition:transform .2s ease, box-shadow .2s ease;
  }
  .glass-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow) }
  .course-body{padding:1rem 1.1rem .6rem}
  .course-body p{margin:0;color:var(--muted)}
  .course-meta{display:flex; gap:1rem; align-items:center; padding:.8rem 1.1rem; border-top:1px solid #eee; color:#444}
  .course-meta i{color:var(--red)}

  .section-title{font-weight:900; color:var(--red)}
  .divider{width:84px;height:3px;border-radius:2px;background:var(--red);margin:.5rem auto 1.5rem}

  /* Lista de cursos (Gestão, NEBOSH, Petróleo & Gás) */
  .list-course .list-group-item{
    display:flex; align-items:center; gap:.6rem; padding:.9rem 1rem; border:0; border-bottom:1px dashed #e8e8e8;
    background:#fff;
  }
  .list-course .fa{color:var(--red)}

  /* CTA lateral */
  .side-cta{background:linear-gradient(145deg,#fff,#ffe9ec); border:1px solid #ffd9de; border-radius:var(--r)}

  footer{background:linear-gradient(135deg,var(--red),var(--red2)); color:#fff}
  .dropdown-item img{width:20px; height:20px; object-fit:cover; border-radius:50%; margin-right:8px; margin-top:8px}

  .accreditations-section{
    background:#fff;
  }
  .accreditation-card{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    gap:1rem;
    padding:1.4rem;
    background:#fff;
    border:1px solid #ececec;
    border-radius:18px;
    box-shadow:var(--shadow-sm);
  }
  .accreditation-logo{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:170px;
    padding:1rem;
    background:#f8f9fb;
    border-radius:14px;
  }
  .accreditation-logo img{
    max-width:100%;
    max-height:150px;
    object-fit:contain;
  }
  .accreditation-card h5{
    margin:0 0 .25rem;
    color:var(--red);
    font-weight:800;
  }
  .accreditation-card p{
    margin:0;
    color:var(--muted);
    font-size:.95rem;
  }

  .nebosh-panel{
    background:linear-gradient(145deg,#fff,#fff6f7);
    border:1px solid #f3d6db;
    padding:1rem;
  }
  .nebosh-group{
    background:#fff;
    border:1px solid #f0e2e4;
    border-radius:16px;
    padding:1rem;
  }
  .nebosh-group h5{
    display:flex;
    align-items:center;
    gap:.55rem;
    margin:0 0 .85rem;
    color:var(--red);
    font-weight:800;
    font-size:1rem;
  }
  .nebosh-list{
    gap:.65rem;
  }
  .nebosh-list .list-group-item{
    border:1px solid #eee;
    border-radius:12px !important;
    line-height:1.35;
    min-height:54px;
  }
  .nebosh-list .list-group-item:last-child{
    border-bottom:1px solid #eee;
  }