/* ACT'IN Campus Océan Indien — bento pastel */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#F2F6FA;color:#172B45;font-family:'DM Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%}
a{color:#172B45}a:hover{color:#2D5B88}
.site{min-height:100vh;overflow-x:hidden}

/* survols */
.lift{transition:transform .4s cubic-bezier(.2,.8,.2,1),box-shadow .4s}
.lift:hover{transform:translateY(-5px);box-shadow:0 30px 50px -30px rgba(23,43,69,.4)}
.arrow{transition:transform .35s}
.lift:hover .arrow{transform:rotate(-45deg)}
nav[aria-label="Menu principal"] > div > a:hover,.mega-btn:hover{background:#E6EEF7}
.mega-btn[aria-expanded="true"]{background:#172B45!important;color:#F2F6FA!important}
.mega[hidden]{display:none}

/* animations */
@keyframes up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.rv{animation:up .9s cubic-bezier(.2,.8,.2,1) both}
@keyframes draw{to{stroke-dashoffset:0}}
.draw{stroke-dasharray:1400;stroke-dashoffset:1400;animation:draw 3.2s .3s ease forwards}
@keyframes pulse{0%{transform:scale(.5);opacity:.9}100%{transform:scale(2.8);opacity:0}}
.pulse{transform-box:fill-box;transform-origin:center;animation:pulse 2.4s ease-out infinite}
@keyframes float{50%{transform:translateY(-10px)}}
.float{animation:float 6s ease-in-out infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.spin{transform-box:fill-box;transform-origin:center;animation:spin 30s linear infinite}
@keyframes dash{to{stroke-dashoffset:-40}}
.route{stroke-dasharray:5 7;animation:dash 1.8s linear infinite}
@keyframes steam{0%{transform:translateY(8px);opacity:0}40%{opacity:1}100%{transform:translateY(-22px);opacity:0}}
.steam{animation:steam 2.8s ease-in infinite}
@keyframes bar{from{transform:scaleX(.15)}to{transform:scaleX(1)}}
.bar{transform-box:fill-box;transform-origin:left;animation:bar 2.6s cubic-bezier(.2,.8,.2,1) infinite alternate}
@keyframes blink{50%{opacity:.3}}
.blink{animation:blink 2s ease-in-out infinite}
@keyframes sway{50%{transform:rotate(4deg)}}
.sway{transform-box:fill-box;transform-origin:bottom center;animation:sway 4s ease-in-out infinite}
@keyframes win{0%,40%{fill:#24364F}50%,90%{fill:#FAD7C3}100%{fill:#24364F}}
.win{animation:win 5s ease-in-out infinite}
@keyframes grow{from{transform:scaleY(.2)}to{transform:scaleY(1)}}
.grow{transform-box:fill-box;transform-origin:bottom;animation:grow 2.4s cubic-bezier(.2,.8,.2,1) infinite alternate}
@keyframes scan{50%{transform:translate(14px,8px)}}
.scan{animation:scan 3s ease-in-out infinite}
@keyframes beat{50%{transform:scale(1.12)}}
.beat{transform-box:fill-box;transform-origin:center;animation:beat 1.6s ease-in-out infinite}

/* surligneur du titre */
.mark{background-image:linear-gradient(transparent 58%,#FAD7C3 58%,#FAD7C3 94%,transparent 94%);background-repeat:no-repeat;background-size:0% 100%;animation:mark 1s .5s cubic-bezier(.2,.8,.2,1) forwards;padding:0 .04em}
@keyframes mark{to{background-size:100% 100%}}

/* onglets / filtres */
.chip{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 18px;border:0;border-radius:999px;background:#FFFFFF;color:#172B45;font:500 15px 'DM Sans',sans-serif;cursor:pointer;box-shadow:inset 0 0 0 1.5px rgba(23,43,69,.15);transition:background .2s,color .2s}
.chip:hover{background:#E6EEF7}
.chip-lg{min-height:52px;padding:0 22px;font-size:16px}
.chip .dot{width:10px;height:10px;border-radius:50%;background:#B9C6D6}
.chip.is-on{background:#172B45;color:#F2F6FA;box-shadow:none}
.chip.is-on .dot{background:#F29E6D}
.chip:focus-visible{outline:2px solid #2D5B88;outline-offset:2px}
.island-panel{display:flex;flex-direction:column;flex:1}
.island-panel[hidden],.island-art[hidden]{display:none}
.island-art{position:relative;width:100%;display:flex;justify-content:center}
[data-domain][hidden]{display:none!important}

/* cartes formation */
.fcard-link{color:inherit;text-decoration:none}
.fcard-link::after{content:"";position:absolute;inset:0;border-radius:28px}
.fcard-link:focus-visible{outline:none}
.fcard:focus-within{outline:2px solid #2D5B88;outline-offset:3px}
.fcard-pdf{position:relative;z-index:2;display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:999px;background:#F2F6FA;color:#172B45;text-decoration:none;font-weight:600;font-size:14px}
.fcard-pdf:hover{background:#172B45;color:#F2F6FA}

/* FAQ */
.faq{border-top:1px solid rgba(23,43,69,.12)}
.faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;font:500 19px 'DM Sans',sans-serif;cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq-sign::before{content:"+";font-size:26px;color:#3B6EA8}
.faq[open] .faq-sign::before{content:"−"}

/* formulaire */
.radio-chip{position:relative}
.radio-chip input{position:absolute;opacity:0;width:1px;height:1px}
.radio-chip input:checked + .chip{background:#172B45;color:#F2F6FA;box-shadow:none}
.radio-chip input:focus-visible + .chip{outline:2px solid #2D5B88;outline-offset:2px}
.field{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600}
.field input,.field select,.field textarea{min-height:50px;padding:0 16px;border-radius:14px;border:1.5px solid rgba(23,43,69,.18);background:#FFFFFF;font:400 16px 'DM Sans',sans-serif;color:#172B45}
.field textarea{padding:14px 16px;resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid #2D5B88;outline-offset:2px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* pages génériques */
.page-plain{max-width:1240px;margin:0 auto;padding:8px 20px 60px}
.page-plain .card{background:#FFFFFF;border-radius:32px;padding:40px}
.page-plain h1{font-family:'Bricolage Grotesque',sans-serif;font-weight:500;font-size:clamp(40px,6vw,72px);letter-spacing:-.03em;line-height:1;margin:0 0 24px}
.prose{font-size:18px;line-height:1.65;max-width:70ch}

@media (prefers-reduced-motion:reduce){*{animation:none!important}.draw{stroke-dashoffset:0}.mark{background-size:100% 100%}}
@media (max-width:760px){
  .g>*{grid-column:span 12!important;grid-row:auto!important}
  .h1{font-size:42px!important}
  .hide-m{display:none!important}
}