/* Bac Français en Tunisie — feuille de style commune
   Palette calée sur le logo : bleu marine, blanc, une seule touche de rouge.
   Registre quiet luxury : sérif, beaucoup de blanc, aucune couleur superflue. */

:root{
  --marine:#12448f;          /* bleu du logo */
  --marine-fonce:#0d2f63;
  --rouge:#d02b2b;           /* rouge du logo — usage strictement ponctuel */
  --texte:#152232;
  --gris:#5c6b7c;
  --bord:#e3e7ee;
  --fond:#fffefc;
  --fond-alt:#f5f7fa;
  --creme:#f8f9fc;
}
@media (prefers-color-scheme: dark){
  :root{--marine:#7ba4e8;--marine-fonce:#a8c4f0;--rouge:#e86b6b;
        --texte:#e9eef5;--gris:#a3b0c0;--bord:#28323f;
        --fond:#0c1219;--fond-alt:#131b25;--creme:#131b25;}
}
:root[data-theme="light"]{--marine:#12448f;--marine-fonce:#0d2f63;--texte:#152232;--gris:#5c6b7c;
  --bord:#e3e7ee;--fond:#fffefc;--fond-alt:#f5f7fa;--creme:#f8f9fc}
:root[data-theme="dark"]{--marine:#7ba4e8;--marine-fonce:#a8c4f0;--texte:#e9eef5;--gris:#a3b0c0;
  --bord:#28323f;--fond:#0c1219;--fond-alt:#131b25;--creme:#131b25}

*{box-sizing:border-box}
body{margin:0;color:var(--texte);background:var(--fond);
     font:17px/1.7 ui-serif,Georgia,"Times New Roman",serif;-webkit-font-smoothing:antialiased}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.narrow{max-width:780px}
a{color:var(--marine)}
img{max-width:100%;height:auto;display:block}

.eyebrow{font-family:ui-sans-serif,-apple-system,sans-serif;font-size:.72rem;font-weight:700;
         letter-spacing:.18em;text-transform:uppercase;color:var(--marine);margin:0 0 14px}
.rule{width:56px;height:2px;background:var(--marine);margin:0 0 26px}

/* En-tête */
header{border-bottom:1px solid var(--bord);position:sticky;top:0;background:var(--fond);z-index:20}
header .wrap{display:flex;align-items:center;gap:28px;min-height:78px;flex-wrap:wrap}
.logo{text-decoration:none;line-height:1.15}
.logo b{display:block;font-size:1.1rem;color:var(--marine-fonce);font-weight:700}
.logo span{display:block;font-family:ui-sans-serif,sans-serif;font-size:.64rem;font-weight:600;
           letter-spacing:.16em;text-transform:uppercase;color:var(--gris);margin-top:3px}
nav{margin-left:auto;display:flex;gap:24px;flex-wrap:wrap;font-family:ui-sans-serif,sans-serif}
nav a{color:var(--gris);text-decoration:none;font-size:.88rem;font-weight:500}
nav a:hover,nav a[aria-current="page"]{color:var(--marine)}

.cta{display:inline-block;font-family:ui-sans-serif,sans-serif;background:var(--marine);
     color:#fff!important;padding:13px 26px;text-decoration:none;font-weight:600;font-size:.86rem;
     letter-spacing:.03em;border:1.5px solid var(--marine);transition:.2s}
.cta:hover{background:transparent;color:var(--marine)!important}
.cta.ghost{background:transparent;color:var(--marine)!important}
.cta.ghost:hover{background:var(--marine);color:#fff!important}

/* Hero */
.hero{padding:88px 0 76px;background:linear-gradient(170deg,var(--creme) 0%,transparent 70%)}
.hero h1{font-size:clamp(2.1rem,5vw,3.5rem);line-height:1.12;letter-spacing:-.02em;
         margin:0 0 22px;max-width:18ch;color:var(--marine-fonce);font-weight:400}
.hero h1 em{font-style:italic;color:var(--marine)}
.hero .lede{font-size:1.18rem;color:var(--gris);max-width:58ch;margin:0 0 34px}
.actions{display:flex;gap:14px;flex-wrap:wrap}

/* Sections */
section{padding:80px 0;border-top:1px solid var(--bord)}
section.alt{background:var(--fond-alt)}
h2{font-size:clamp(1.6rem,3.2vw,2.3rem);line-height:1.22;letter-spacing:-.015em;
   margin:0 0 18px;color:var(--marine-fonce);font-weight:400;max-width:22ch}
.sub{color:var(--gris);margin:0 0 40px;max-width:64ch;font-size:1.05rem}
h3{font-size:1.12rem;margin:0 0 10px;color:var(--marine-fonce);font-weight:600}

.grid{display:grid;gap:34px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.grid-2{display:grid;gap:54px;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));align-items:start}
.item p{margin:0;color:var(--gris);font-size:.98rem}
.num{font-family:ui-sans-serif,sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.14em;
     color:var(--marine);display:block;margin-bottom:12px;text-transform:uppercase}

/* Bandeau de repères */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
       border-top:1px solid var(--bord);border-bottom:1px solid var(--bord)}
.stat{padding:32px 24px;border-right:1px solid var(--bord)}
.stat:last-child{border-right:none}
.stat b{display:block;font-size:2.1rem;line-height:1.1;color:var(--marine-fonce);font-weight:400;letter-spacing:-.02em}
.stat span{display:block;font-family:ui-sans-serif,sans-serif;font-size:.72rem;letter-spacing:.13em;
           text-transform:uppercase;color:var(--gris);margin-top:11px}

/* Listes */
.feats{list-style:none;padding:0;margin:0;columns:2;column-gap:44px}
@media(max-width:640px){.feats{columns:1}}
.feats li{break-inside:avoid;padding:14px 0 14px 26px;position:relative;
          border-bottom:1px solid var(--bord);color:var(--gris)}
.feats li::before{content:"—";position:absolute;left:0;color:var(--marine)}
.feats li b{color:var(--texte);font-weight:600}

.etapes{list-style:none;padding:0;margin:0;counter-reset:e}
.etapes li{counter-increment:e;position:relative;padding:22px 0 22px 62px;border-bottom:1px solid var(--bord)}
.etapes li::before{content:counter(e,decimal-leading-zero);position:absolute;left:0;top:24px;
  font-family:ui-sans-serif,sans-serif;font-size:.78rem;font-weight:700;letter-spacing:.1em;color:var(--marine)}
.etapes b{display:block;color:var(--marine-fonce);margin-bottom:4px}
.etapes p{margin:0;color:var(--gris);font-size:.97rem;max-width:64ch}

/* Tableaux */
.scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:.96rem;font-family:ui-sans-serif,sans-serif;min-width:460px}
th,td{text-align:left;padding:14px 14px;border-bottom:1px solid var(--bord);vertical-align:top}
th{font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:var(--marine);font-weight:700}

/* FAQ */
.faq details{border-bottom:1px solid var(--bord);padding:20px 0}
.faq summary{cursor:pointer;font-weight:600;color:var(--marine-fonce);font-size:1.04rem;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"+";color:var(--marine);font-weight:400;margin-right:14px}
.faq details[open] summary::before{content:"–"}
.faq p{color:var(--gris);margin:14px 0 0 28px;max-width:68ch;font-size:.99rem}

/* Encadré réservé au travail interne — à retirer avant mise en ligne */
.todo{border-left:3px solid var(--rouge);background:var(--fond-alt);padding:20px 24px;margin:32px 0;
      font-family:ui-sans-serif,sans-serif;font-size:.9rem}
.todo b{color:var(--rouge);letter-spacing:.06em;text-transform:uppercase;font-size:.72rem;
        display:block;margin-bottom:8px}
.todo p{margin:0;color:var(--gris)}

/* Avertissement factuel (dates non confirmées, etc.) */
.note{border-left:3px solid var(--marine);background:var(--creme);padding:18px 22px;margin:28px 0;
      font-family:ui-sans-serif,sans-serif;font-size:.9rem;color:var(--gris)}
.note b{color:var(--marine-fonce)}

footer{border-top:1px solid var(--bord);padding:60px 0 42px;background:var(--fond-alt)}
.fine{color:var(--gris);font-size:.85rem;margin-top:42px;font-family:ui-sans-serif,sans-serif;
      max-width:78ch;line-height:1.6}