/* Al Manar — visual redesign, October 2026. Content remains in original HTML. */
:root {
  --am-ink: #173650;
  --am-navy: #153d75;
  --am-blue: #145ed9;
  --am-green: #16775b;
  --am-mist: #f3f7fc;
  --am-line: #dce5ef;
  --am-honey: #f2c66b;
  --am-gutter: clamp(20px, 4vw, 64px);
}
html { scroll-behavior: smooth; scroll-padding-top: 105px; }
html.home-page-root { scroll-snap-type: none; scroll-padding-top: 0; }
body { color: var(--am-ink); background: #fff; font-family: Inter, Arial, sans-serif; -webkit-font-smoothing: antialiased; }
*, *::before, *::after { box-sizing: border-box; }
body .container { width: min(1200px, calc(100% - 2 * var(--am-gutter))); max-width: none; margin-inline: auto; padding-inline: 0; }
h1, h2, h3, h4, .font-display { font-family: Poppins, Arial, sans-serif; font-weight: 600; letter-spacing: -.035em; text-wrap: balance; }
p { text-wrap: pretty; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
button, summary, a { touch-action: manipulation; }
img { max-width: 100%; }
a:focus-visible, button:focus-visible, summary:focus-visible { outline: 3px solid var(--am-blue); outline-offset: 5px; }
[id] { scroll-margin-top: 110px; }
html[dir="rtl"] body, html[dir="rtl"] .font-display { letter-spacing: 0; }
html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3 { line-height: 1.6; }
.site-header { position: sticky; top: 0; z-index: 50; background: rgb(255 255 255 / .97); border: 0; box-shadow: 0 1px 0 var(--am-line); backdrop-filter: blur(16px); }
.site-header > nav.container { min-height: 88px; padding-block: 14px !important; display: flex; gap: 28px; align-items: center; justify-content: space-between; }
.site-header .brand-lockup { display: flex; align-items: center; gap: 12px; text-decoration: none; flex: 0 0 auto; }
.site-header .brand-mark { width: 40px; height: 54px; object-fit: contain; }
.site-header .brand-name { color: var(--am-navy); font-size: 15px; font-weight: 700; line-height: 1.45; }
.site-header > nav > .md\:flex { gap: 26px; }
.site-header > nav > .md\:flex a { min-height: 44px; display: inline-flex; align-items: center; color: #344c64; position: relative; font-size: 13px; font-weight: 600; white-space: nowrap; }
.site-header > nav > .md\:flex a::after { content: ''; position: absolute; inset-inline: 0; bottom: 2px; height: 2px; background: var(--am-blue); transform: scaleX(0); transition: transform .18s ease; }
.site-header > nav > .md\:flex a:hover, .site-header > nav > .md\:flex a[data-active] { color: var(--am-blue); }
.site-header > nav > .md\:flex a:hover::after, .site-header > nav > .md\:flex a[data-active]::after { transform: scaleX(1); }
.header-end { gap: 20px; }
.language-switcher { gap: 0; padding: 3px; background: #f3f6fa; border: 1px solid #e7edf3; border-radius: 12px; font-size: 11px; }
.language-switcher > span { display: none; }
.language-switcher a, .header-end .language-switcher a { min-width: 34px; min-height: 38px; border-radius: 8px; color: #52667c; }
.language-switcher a[aria-current="true"] { background: #fff; color: var(--am-navy); box-shadow: 0 2px 5px #153d7510; }
.site-header .header-end > a[data-slot="button"] { min-height: 46px; padding: 11px 19px; border-radius: 12px; background: var(--am-blue); font-size: 13px; font-weight: 600; }
.site-header .header-end > a[data-slot="button"]:hover { background: var(--am-navy); }
.mobile-menu { display: none; }
.home-hero { background: #f1f6fc; padding: clamp(40px, 5vw, 76px) 0 56px; overflow: visible; }
.home-hero > .absolute { display: none; }
.hero-top { display: grid; grid-template-columns: 1fr 1.05fr; align-items: center; gap: 46px; margin-bottom: 46px; }
.hero-intro { min-width: 0; padding-block: 12px; }
.home-hero .contact-eyebrow { color: #536e8c !important; letter-spacing: .06em; font-size: 11px; font-weight: 600; margin-bottom: 21px; }
.home-hero h1 { font-size: clamp(38px, 4.5vw, 62px); line-height: 1.13; color: var(--am-navy); font-weight: 600; margin: 0; max-width: 560px; letter-spacing: -.055em; }
.hero-photograph { margin: 0; position: relative; padding: 0 0 13px 0; }
.hero-photograph::before { content: ''; position: absolute; inset: 14px -12px 0 16px; background: #c6dfd6; border-radius: 64px 22px 64px 22px; }
.hero-photograph > img { position: relative; width: 100%; height: clamp(260px, 24vw, 330px); border-radius: 64px 22px 64px 22px; object-fit: cover; object-position: 44% 48%; }
.hero-photo-detail { position: absolute; inset-inline-start: -17px; bottom: 0; width: 64px; height: 64px; border-radius: 50%; background: var(--am-honey); border: 9px solid #f1f6fc; }
.hero-missions { gap: 0; border-radius: 20px; background: white; border: 1px solid #e1e9f2; box-shadow: 0 12px 34px #153d7506; margin-bottom: 30px; overflow: hidden; }
.home-missions-section .lever-card { background: none; border-radius: 0; box-shadow: none; padding: 28px 32px 30px; height: 100%; }
.home-missions-section .lever-card + .lever-card { border-inline-start: 1px solid var(--am-line); }
.lever-card > span { font-size: 10px; letter-spacing: .08em; padding: 6px 10px; margin-bottom: 16px; border-radius: 6px; background: #e9f1ff; color: #154a8c; }
.lever-card + .lever-card > span { background: #e8f5ef; color: #126447; }
.home-missions-section .lever-card h3 { font-size: clamp(20px, 2vw, 24px); line-height: 1.4; color: var(--am-navy); margin-bottom: 14px; letter-spacing: -.025em; max-width: 480px; }
.home-missions-section .lever-label { font-size: 10px; letter-spacing: .07em; margin-bottom: 6px; color: #315e94; }
.home-missions-section .lever-card + .lever-card .lever-label { color: var(--am-green); }
.home-missions-section .lever-card p.font-body { font-size: 15px; line-height: 1.85; color: #4e647a; max-width: 60ch; }
.home-missions-section > .container > p { font-size: 16px; line-height: 1.9; max-width: 1030px; margin-bottom: 24px; }
.home-missions-section > .container > p strong { color: var(--am-navy); }
.home-missions-section > .container > .flex { gap: 12px; }
.home-missions-section [data-slot="button"] { height: auto; min-height: 48px; padding: 12px 20px; border-radius: 11px; color: var(--am-navy); background: #fff; border: 1px solid #cad8e8; font-size: 13px; font-weight: 600; }
.home-missions-section [data-slot="button"]:first-child { color: #fff; background: var(--am-navy); border-color: var(--am-navy); }
.home-missions-section [data-slot="button"]:hover { background: #e3edfa; color: var(--am-navy); }
.home-missions-section [data-slot="button"]:first-child:hover { background: #0d2f61; color: #fff; }
.home-programs { background: #fff; }
.home-page .home-program { padding-block: clamp(56px, 6vw, 84px); margin-bottom: 0; }
.home-page .home-program, .home-page .resources-section, .home-page .contact-section { scroll-margin-top: 100px !important; }
.home-program + .home-program { border-top: 1px solid var(--am-line); }
.home-program > .grid { gap: clamp(32px, 5vw, 72px); }
.home-program h2 { font-size: clamp(30px, 3.1vw, 43px); color: var(--am-navy); line-height: 1.23; margin-bottom: 25px; }
.home-program p { font-size: 16px; line-height: 1.95; color: #506579; margin-bottom: 20px; }
.home-program p strong { font-weight: 600; color: #254867; }
.home-program .flex.flex-wrap { gap: 8px; margin: 25px 0; }
.home-program .flex.flex-wrap > span { font-size: 11px; padding: 7px 11px; border-radius: 7px; background: #eff4fb; color: #325b8c; }
.home-program .inline-block > span { padding: 0; background: none; border-radius: 0; font-size: 11px; letter-spacing: .07em; color: var(--am-green); }
.home-program [data-slot="button"] { min-height: 48px; height: auto; padding: 12px 20px; border-radius: 11px; background: var(--am-navy); font-size: 13px; }
.home-program [data-slot="button"]:hover { background: var(--am-blue); }
.home-program .shadow-xl { box-shadow: none; border-radius: 28px; background: var(--am-mist); }
.home-program img { width: 100%; height: 380px; object-fit: cover; }
.home-program .home-garden-photo { object-position: 43% 50%; }
#formations .shadow-xl { border-radius: 28px 70px 28px 28px; }
#formations img { object-position: 52% 45%; }
#formations .flex.flex-wrap > span { color: #21684f; background: #edf6f2; }
#africeduc > .grid { padding: 42px; background: #f2f7f5; border-radius: 28px; }
#africeduc .shadow-xl { padding: 0; background: white; border-radius: 50%; aspect-ratio: 1; width: min(100%, 390px); max-width: 390px; margin-inline: auto; display: grid; place-items: center; box-shadow: 0 0 0 1px #dce8e1; }
#africeduc img.africeduc-mark { display: block; padding: 0; background: transparent; width: 82%; height: 82%; aspect-ratio: auto; object-fit: contain; }
#africeduc .inline-block > span { color: #4b725c; }
#africeduc .flex.flex-wrap > span { background: #e3eee7; color: #37644e; }
.home-page .vision-section { padding-block: 76px 82px; background: var(--am-navy); color: #fff; }
.vision-section .vision-intro { margin: 0; max-width: 800px; text-align: start; }
.vision-intro h2 { color: #fff; font-size: clamp(30px, 3vw, 42px); margin-bottom: 20px; }
.vision-intro p { font-size: 16px; line-height: 1.9; color: #dce8f6; max-width: 72ch; }
.vision-grid { gap: 26px; margin-top: 42px; max-width: none; }
.vision-card { background: transparent; border-radius: 0; padding: 0; box-shadow: none; text-align: start; }
.vision-card img { position: static; width: 100%; height: 220px; border: 0; border-radius: 18px; transform: none; box-shadow: none; margin: 0 0 24px; object-fit: cover; }
.vision-card h3 { color: #fff; font-size: 21px; margin-bottom: 10px; }
.vision-card p { color: #cfdeef; font-size: 14px; line-height: 1.8; }
.home-page .resources-section { background: #fff; padding-block: 80px; }
.resources-section h2 { color: var(--am-navy); font-size: clamp(28px, 3vw, 38px); margin-bottom: 16px; }
.resources-section > .container > p { font-size: 16px; color: #5d7082; margin-bottom: 30px; }
.resource-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.resource-card { padding: 26px; border: 1px solid var(--am-line); border-radius: 16px; background: #f8fafd; box-shadow: none; display: flex; flex-direction: column; gap: 12px; min-width: 0; transition: border-color .2s; }
.resource-card:hover { border-color: var(--am-blue); box-shadow: none; transform: none; }
.resource-card strong { font-family: Poppins, sans-serif; color: var(--am-navy); font-size: 23px; }
.resource-card > span { font-size: 14px; color: #526a82; }
.resource-card .resource-action { color: var(--am-blue); margin-top: auto; padding-top: 14px; font-size: 12px; font-weight: 600; }
.home-page .contact-section { background: #edf3fa; padding-block: 76px; }
.contact-panel { gap: 70px; }
.contact-copy .contact-eyebrow { color: #557294 !important; font-size: 11px; margin-bottom: 16px; }
.contact-copy h2 { font-size: clamp(28px, 3vw, 38px); letter-spacing: -.035em; line-height: 1.35; color: var(--am-navy); margin-bottom: 20px; }
.contact-copy > p:not(.contact-eyebrow) { font-size: 15px; line-height: 1.85; color: #526a82; }
.contact-copy address { gap: 18px; margin-top: 28px; }
.contact-icon { width: 42px; height: 42px; flex-basis: 42px; background: white; color: var(--am-navy); border: 1px solid #dce6f1; border-radius: 12px; }
.contact-label { font-size: 11px; color: #5e7389; }
.contact-row p, .contact-row a { font-size: 13px; font-weight: 500; line-height: 1.7; color: #294864; }
.contact-row a { min-height: 32px; display: inline-flex; align-items: center; }
.contact-map { background: #fff; border: 0; border-radius: 22px; box-shadow: none; padding: 24px; }
.contact-map h3 { font-size: 21px; color: var(--am-navy); }
.contact-map p { font-size: 12px; color: #587086; margin-block: 10px 20px; }
.contact-map iframe { height: 320px; border-radius: 12px; }
.contact-map .map-button { border-radius: 10px; background: var(--am-navy); font-size: 12px; min-height: 46px; }
.site-footer { background: #102e55; color: #bcd0e4; border: 0; padding-block: 58px 30px; }
.site-footer h3 { color: #fff; font-size: 27px; margin-bottom: 17px; }
.site-footer h4 { color: #fff; font-size: 14px; letter-spacing: 0; margin-bottom: 20px; }
.site-footer p { font-size: 13px; line-height: 1.9; }
.site-footer a, .site-footer .footer-phones a { color: #c2d5e8; font-size: 12px; line-height: 2; }
.site-footer a:hover, .site-footer .footer-phones a:hover { color: #fff; text-decoration: underline; }
.site-footer .border-gray-800 { border-color: #2c476b; }
.site-footer .text-gray-400 { color: #c2d5e8; }
.site-footer .border-t p { font-size: 11px; color: #9db7d1; }
@media (max-width: 1100px) {
  .site-header > nav > .md\:flex { gap: 18px; }
  .site-header > nav.container { gap: 18px; }
  .header-end { gap: 14px; }
  .site-header .brand-name { font-size: 13px; }
  .site-header .brand-mark { width: 34px; }
  .site-header .header-end > a[data-slot="button"] { font-size: 12px; padding-inline: 14px; }
  .hero-top { gap: 30px; }
}
@media (max-width: 1000px) {
  .site-header > nav > .md\:flex { display: none; }
  .site-header > nav.container { min-height: 80px; padding-inline-end: 62px; }
  .site-header .header-end > a[data-slot="button"] { display: none; }
  .site-header .brand-name { font-size: 14px; }
  .mobile-menu { display: block; margin: 0; border: 0; padding: 0; }
  .mobile-menu > summary { position: absolute; top: 18px; inset-inline-end: var(--am-gutter); list-style: none; width: 45px; height: 45px; display: flex; justify-content: center; align-items: center; border: 1px solid var(--am-line); border-radius: 11px; background: #fff; color: var(--am-navy); font-size: 10px; cursor: pointer; padding: 0; }
  .mobile-menu > summary::-webkit-details-marker { display: none; }
  .mobile-menu > div { padding: 14px var(--am-gutter) 22px; border-top: 1px solid var(--am-line); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; box-shadow: 0 10px 18px #153d7506; }
  .mobile-menu:not([open]) > div { display: none; }
  .mobile-menu > div > a { font-size: 13px; padding: 12px 14px; min-height: 46px; background: #f4f7fb; color: var(--am-navy); border-radius: 9px; }
  .mobile-menu > div > a:hover { background: #e4edfa; }
  .hero-top { grid-template-columns: 1fr 1fr; }
  .home-hero h1 { font-size: clamp(36px, 4.8vw, 48px); }
  .hero-photograph > img { height: 280px; }
  .home-missions-section .lever-card { padding: 24px; }
  .home-program > .grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .home-program img { height: 350px; }
  #africeduc > .grid { padding: 30px; }
  .contact-panel { gap: 35px; }
}
@media (max-width: 767px) {
  html { scroll-padding-top: 95px; }
  .site-header .brand-name { font-size: 12px; }
  .site-header .brand-lockup { gap: 8px; }
  .site-header .brand-mark { width: 29px; height: 42px; }
  .site-header > nav.container { gap: 8px; min-height: 76px; padding-inline-end: 50px; padding-block: 15px !important; }
  .site-header .header-end { gap: 0; }
  .header-end .language-switcher a { min-width: 28px; min-height: 36px; font-size: 10px; }
  .mobile-menu > summary { width: 40px; height: 42px; top: 17px; }
  .mobile-menu > div { grid-template-columns: 1fr 1fr; }
  .home-hero { padding-block: 35px 38px; }
  .hero-top { grid-template-columns: 1fr; gap: 26px; margin-bottom: 32px; }
  .hero-intro { padding: 0; }
  .home-hero .contact-eyebrow { font-size: 9px; letter-spacing: .045em; margin-bottom: 18px; }
  .home-hero h1 { font-size: clamp(36px, 8.7vw, 54px); max-width: 570px; line-height: 1.15; }
  .hero-photograph { margin-inline: 0 10px; padding-bottom: 9px; }
  .hero-photograph > img { height: clamp(200px, 57vw, 340px); object-position: 45% 40%; border-radius: 38px 16px 38px 16px; }
  .hero-photograph::before { border-radius: 38px 16px 38px 16px; inset: 10px -9px 0 10px; }
  .hero-photo-detail { width: 50px; height: 50px; border-width: 7px; inset-inline-start: -8px; }
  .hero-missions { grid-template-columns: 1fr; border-radius: 16px; margin-bottom: 24px; }
  .home-missions-section .lever-card { padding: 26px 22px; }
  .home-missions-section .lever-card + .lever-card { border-inline-start: 0; border-top: 1px solid var(--am-line); }
  .home-missions-section .lever-card h3 { font-size: 21px; }
  .home-missions-section .lever-card p.font-body { font-size: 14px; line-height: 1.85; }
  .home-missions-section > .container > p { font-size: 14px; line-height: 1.9; }
  .home-missions-section > .container > .flex { flex-direction: column; }
  .home-missions-section [data-slot="button"] { width: 100%; min-height: 49px; font-size: 13px; }
  .home-page .home-program { padding-block: 46px; }
  .home-page .home-program, .home-page .resources-section, .home-page .contact-section { scroll-margin-top: 88px !important; }
  .home-program > .grid { grid-template-columns: 1fr; gap: 26px; }
  .home-program h2 { font-size: 30px; }
  .home-program p { font-size: 15px; line-height: 1.9; }
  .home-program img { height: auto; aspect-ratio: 1.35; }
  .home-program .shadow-xl { border-radius: 20px; }
  .home-program [data-slot="button"] { width: 100%; }
  #formations .order-2 { order: 2; }
  #formations .order-1 { order: 1; }
  #africeduc > .grid { padding: 27px 22px; border-radius: 20px; }
  #africeduc h2 { font-size: 32px; }
  #africeduc .shadow-xl { width: min(290px, 100%); padding: 0; }
  .home-page .vision-section { padding-block: 48px; }
  .vision-intro h2 { font-size: 31px; }
  .vision-intro p { font-size: 15px; }
  .vision-grid { grid-template-columns: 1fr; gap: 34px; max-width: none; margin-top: 32px; }
  .vision-card img { height: auto; aspect-ratio: 1.65; margin-bottom: 18px; }
  .vision-card h3 { font-size: 23px; }
  .home-page .resources-section, .home-page .contact-section { padding-block: 48px; }
  .resources-section h2 { font-size: 29px; }
  .resources-section > .container > p { font-size: 14px; line-height: 1.8; }
  .resource-grid { grid-template-columns: 1fr; gap: 14px; }
  .resource-card { padding: 24px; }
  .contact-panel { grid-template-columns: 1fr; gap: 32px; }
  .contact-copy h2 { font-size: 29px; }
  .contact-map { padding: 20px; border-radius: 17px; }
  .contact-map iframe { height: 270px; }
  .contact-map .map-button { font-size: 11px; padding-inline: 8px; }
  .site-footer { padding-block: 42px 24px; }
  .site-footer .grid { grid-template-columns: 1fr 1fr; gap: 30px 20px; }
  .site-footer .grid > div:first-child, .site-footer .grid > div:last-child { grid-column: 1 / -1; }
  .site-footer a, .site-footer .footer-phones a { min-height: 32px; display: inline-flex; align-items: center; }
  .site-footer .footer-phones { gap: 0 20px; display: flex; flex-wrap: wrap; }
}
@media (max-width: 359px) {
  .site-header .brand-name { font-size: 10px; }
  .site-header .brand-mark { width: 25px; }
  .header-end .language-switcher a { min-width: 23px; }
  .home-hero h1 { font-size: 34px; }
  .home-missions-section .lever-card { padding-inline: 18px; }
  .home-program h2 { font-size: 27px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

.contact-copy .contact-emails { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; min-width: 0; }
.contact-copy .contact-emails a { overflow-wrap: anywhere; }

.home-page #formations .home-training-photo { height: auto; aspect-ratio: auto; object-fit: contain; }
