/* ==========================================================================
   أكاديمية تمكّن — Static site styles
   Global resets, hover/focus states, responsive nav, tabs & accordions.
   Layout/visual styling lives inline on the elements (exported from design).
   ========================================================================== */

html, body { margin: 0; padding: 0; background: #E7ECEF; }
* { box-sizing: border-box; }
a { color: #C41F2C; text-decoration: none; }
a:hover { color: #A81823; }
::selection { background: #C6E4F0; }
input, textarea, select, button { font-family: inherit; }
img { max-width: 100%; }

:focus-visible { outline: 3px solid #0F6B8C; outline-offset: 2px; border-radius: 6px; }

/* ---------- Buttons / hover states (were style-hover in the design) ------- */
.btn-red:hover        { background: #A81823 !important; }
.btn-outline:hover    { background: #231F20 !important; color: #fff !important; border-color: #231F20 !important; }
.btn-dark-outline:hover { background: #231F20 !important; color: #fff !important; }
.btn-white:hover      { background: #FFE9EB !important; }
.btn-black:hover      { background: #000 !important; }
.btn-blue:hover       { background: #D6EBF4 !important; }
.card-link:hover      { border-color: #ED3341 !important; transform: translateY(-3px); }
.link-li:hover        { background: #D6EBF4 !important; color: #0A5570 !important; }
.footer-link:hover    { color: #fff !important; }
.dir-card:hover       { background: #ED3341 !important; }

/* ---------- Form fields ---------- */
.field:focus { border-color: #0F6B8C !important; background: #fff !important; }

/* ---------- Header: desktop nav vs mobile burger --------------------------- */
.nav-desktop { display: flex; }
.nav-burger  { display: none; }
.nav-mobile  { display: none; }
.nav-mobile.is-open { display: flex; }

@media (max-width: 899px) {
  .nav-desktop { display: none; }
  .nav-burger  { display: flex; }
}

/* ---------- Hero: keep the headline readable over the illustration -------- */
@media (max-width: 760px) {
  .hero-veil {
    background: linear-gradient(to bottom, rgba(255,255,255,.94) 0%, rgba(255,255,255,.88) 55%, rgba(255,255,255,.72) 100%) !important;
  }
}

/* ---------- Tabs & panels -------------------------------------------------- */
.tab {
  font-weight: 600; border-radius: 999px; padding: 12px 20px; cursor: pointer;
  min-height: 46px; text-align: right; line-height: 1.6;
  border: 1.5px solid #E4EAEE; color: #3E4A52; background: #fff;
  transition: background .18s, border-color .18s, color .18s;
}
.tab:hover { border-color: #C9D3D9; }
.tab[aria-selected="true"] { background: #231F20; color: #fff; border-color: #231F20; }
.panel[hidden] { display: none !important; }

/* ---------- Accordions (course details / team bios) ------------------------ */
.collapse[hidden] { display: none !important; }

/* ---------- Print ---------------------------------------------------------- */
@media print {
  .nav-burger, .nav-mobile, .cta-band { display: none !important; }
  .collapse { display: block !important; }
}