/* ==========================================================================
   EDUC'ALLIANCE — Design system partagé
   Aligné sur le handoff Claude Design (design_handoff_educalliance) :
   tokens, easing signature cubic-bezier(0.16,1,0.3,1), radius 10/12/16px,
   glows et animations exacts. Ne pas modifier sans validation.
   ========================================================================== */

:root{
  --marine:#0e2038;
  --marine-clair:#16294a;
  --creme:#fbf9f2;
  --creme-fond:#f7f4ed;
  --texte-clair:#f5f1e8;
  --or-clair:#C9AE7E;
  --or:#B99C6B;
  --or-fonce:#7d6739;
  --gradient-or:linear-gradient(180deg,#D0B98F 0%,#B99C6B 55%,#A6885A 100%);
  --gris-ligne:rgba(14,32,56,.12);
  --texte:#0e2038;
  --texte-doux:rgba(14,32,56,.68);
  --texte-doux-clair:rgba(200,214,235,.72);
  --radius-btn:10px;
  --radius:12px;
  --radius-flottant:16px;
  --easing:cubic-bezier(0.16,1,0.3,1);
  --glow-btn:0 0 18px rgba(185,156,107,.45),0 0 44px rgba(185,156,107,.2);
  --container:1120px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;color:var(--texte);background:var(--creme-fond);line-height:1.6;min-height:100vh;overflow-x:hidden}
h1,h2,h3,h4{font-family:'Fraunces',serif;line-height:1.2;font-weight:500}
h1{font-size:clamp(32px,4.2vw,50px);line-height:1.18}
h2{font-size:clamp(24px,2.8vw,34px)}
h3{font-size:1.25rem}
p{color:var(--texte-doux)}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{max-width:var(--container);margin:0 auto;padding:0 40px}
@media (max-width:640px){.container{padding:0 22px}}

/* ---------- Animations signature ---------- */
@keyframes ea-fadein{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes ea-line{from{width:0}to{width:64px}}
@keyframes ea-sweep{from{left:-45%}to{left:125%}}
@keyframes ea-twinkle{0%,100%{opacity:.5;transform:scale(.92)}50%{opacity:1;transform:scale(1.1)}}
@keyframes ea-iconpulse{0%,100%{transform:scale(1) rotate(0deg)}50%{transform:scale(1.12) rotate(-6deg)}}
@keyframes ea-badgeshine{0%,100%{filter:brightness(1)}50%{filter:brightness(1.3)}}

/* ---------- Sections marine / crème ---------- */
.section{padding:80px 0 88px}
@media (max-width:640px){.section{padding:56px 0 64px}}
.section-marine{background:var(--marine);color:var(--texte-clair)}
.section-marine h1,.section-marine h2,.section-marine h3{color:var(--texte-clair)}
.section-marine p{color:var(--texte-doux-clair)}
.section-creme{background:var(--creme-fond)}
.section-creme-fond{background:var(--creme-fond)}

.eyebrow{display:block;font-size:12px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;margin-bottom:18px;color:var(--or-fonce)}
.section-marine .eyebrow{color:var(--or-clair)}
.ligne-or{width:42px;height:1px;background:var(--or);margin-bottom:22px}

/* ---------- Boutons (chatoiement argenté au survol) ---------- */
.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:15px 28px;border-radius:var(--radius-btn);font-weight:600;font-size:13.5px;font-family:'Inter',sans-serif;transition:transform .22s,box-shadow .22s,background .22s;cursor:pointer;border:none}
.btn::before{content:"";position:absolute;top:-60%;bottom:-60%;left:-45%;width:38%;background:linear-gradient(105deg,rgba(255,255,255,0),rgba(240,244,250,.6),rgba(255,255,255,0));transform:skewX(-20deg);opacity:0;pointer-events:none}
.btn:hover::before{opacity:1;animation:ea-sweep .9s ease}
.btn .fleche{transition:transform .25s}
.btn:hover .fleche{transform:translateX(5px)}
.btn-bleu{background:var(--marine);color:var(--texte-clair)}
.btn-bleu:hover{background:var(--marine-clair);transform:translateY(-2px);box-shadow:0 12px 28px rgba(14,32,56,.28)}
.btn-or{background:var(--gradient-or);color:var(--marine);box-shadow:var(--glow-btn)}
.btn-or:hover{transform:translateY(-2px);box-shadow:0 0 24px rgba(185,156,107,.5),0 0 54px rgba(185,156,107,.26)}
.btn-ligne{border:1px solid rgba(140,170,210,.55);color:inherit;background:transparent}
.btn-ligne:hover{background:var(--texte-clair);color:var(--marine)}
.section-creme .btn-ligne,.section-creme-fond .btn-ligne{border-color:var(--marine);color:var(--marine)}
.section-creme .btn-ligne:hover,.section-creme-fond .btn-ligne:hover{background:var(--marine);color:var(--texte-clair)}
.btn-large{width:100%;padding:18px 30px;font-size:1rem}

/* ---------- Nav ---------- */
nav{position:sticky;top:0;z-index:100;background:rgba(14,32,56,.88);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.08)}
.nav-inner{max-width:var(--container);margin:0 auto;padding:0 40px;display:flex;align-items:center;justify-content:space-between;height:70px;gap:24px}
.logo{display:inline-flex;align-items:center;gap:12px;font-family:'Fraunces',serif;font-weight:600;font-size:17px;letter-spacing:.08em;color:var(--texte-clair);flex-shrink:0}
.logo svg{flex-shrink:0}
.nav-liens{display:flex;align-items:center;gap:28px;flex:1;justify-content:center}
.nav-liens a{font-size:12.5px;font-weight:500;color:rgba(245,241,232,.75);transition:color .2s;white-space:nowrap}
.nav-liens a:hover,.nav-liens a.actif{color:var(--or-clair)}
.nav-droite{display:flex;align-items:center;gap:18px;flex-shrink:0}
.nav-droite .btn{padding:10px 18px;font-size:12.5px;font-weight:700}
.nav-burger{display:none;background:none;border:none;color:var(--texte-clair);cursor:pointer;padding:8px}
@media (max-width:900px){
  .nav-liens{position:fixed;top:70px;left:0;right:0;background:var(--marine);flex-direction:column;align-items:flex-start;padding:20px 24px;gap:18px;border-bottom:1px solid rgba(255,255,255,.08);transform:translateY(-8px);opacity:0;pointer-events:none;transition:transform .25s,opacity .25s}
  .nav-liens.ouvert{transform:translateY(0);opacity:1;pointer-events:auto}
  .nav-burger{display:block}
  .nav-inner{padding:0 22px}
}

/* ---------- Cartes (lift -9px + glow doré, pulsation d'icône) ---------- */
.carte{border:1px solid var(--gris-ligne);border-radius:var(--radius);background:var(--creme);will-change:transform;transition:transform .35s var(--easing),box-shadow .35s ease,border-color .35s ease}
.carte:hover{transform:translateY(-9px);border-color:rgba(217,192,148,.95);box-shadow:0 0 12px rgba(185,156,107,.28),0 0 30px rgba(185,156,107,.12)}
.carte:hover .ea-icon{animation:ea-iconpulse 1.2s ease-in-out}
.carte-marine{background:var(--marine-clair);border-color:rgba(201,174,126,.65);box-shadow:0 0 8px rgba(185,156,107,.15),0 0 20px rgba(185,156,107,.06)}

/* ---------- Lignes-cartes (page formules) ---------- */
.ligne-carte{border-radius:var(--radius);padding:26px 30px;display:grid;grid-template-columns:1.2fr auto;gap:24px;align-items:center;will-change:transform;transition:transform .35s var(--easing)}
.ligne-carte:hover{transform:translateY(-8px)}
@media (max-width:640px){.ligne-carte{grid-template-columns:1fr}.ligne-carte .prix-bloc{text-align:left !important}}

/* ---------- Apparition au scroll ---------- */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .9s var(--easing),transform .9s var(--easing)}
.reveal.in-view{opacity:1;transform:translateY(0)}

/* ---------- Grilles ---------- */
.grille-2{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.grille-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
@media (max-width:900px){.grille-4{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.grille-2,.grille-4{grid-template-columns:1fr}}

/* ---------- Points de confiance (réservation, contact) ---------- */
.ea-trust{display:flex;align-items:center;gap:14px}
.ea-trust span{font-size:15px;color:rgba(200,214,235,.8);transition:color .3s ease}
.ea-trust:hover span{color:var(--or-clair)}
.ea-trust:hover .ea-icon{animation:ea-iconpulse 1.2s ease-in-out}

/* ---------- Footer ---------- */
footer{background:var(--marine);color:var(--texte-doux-clair);border-top:1px solid rgba(255,255,255,.07)}
.footer-inner{max-width:var(--container);margin:0 auto;padding:64px 40px 28px}
.footer-grid{display:grid;grid-template-columns:1.3fr 0.8fr 0.8fr 1fr;gap:40px;align-items:start}
.footer-brand{display:flex;flex-direction:column;gap:10px}
.footer-brand .logo{font-size:16px}
.footer-brand .tagline{font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--or-clair)}
.footer-col{display:flex;flex-direction:column;gap:10px}
.footer-col h4{font-family:'Inter',sans-serif;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--or-clair);margin-bottom:16px}
.footer-col a{font-size:13.5px;color:rgba(230,236,245,.75);transition:color .2s}
.footer-col a:hover{color:var(--or-clair)}
.footer-sep{height:1px;background:rgba(255,255,255,.1);margin:48px 0 20px}
.footer-bas{text-align:center;font-size:12px;color:rgba(200,214,235,.5)}
@media (max-width:900px){.footer-grid{grid-template-columns:1fr 1fr;row-gap:36px}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr}}
