/* Okalee : habillage du générateur d'objectifs aux couleurs de la plateforme */
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(inter-normal-latin.woff2) format("woff2")}
@font-face{font-family:Inter;font-style:normal;font-weight:100 900;font-display:swap;src:url(inter-normal-latin-ext.woff2) format("woff2");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{
 --background:220 17% 96%;--foreground:222 25% 14%;--card:0 0% 100%;--card-foreground:222 25% 14%;--popover:0 0% 100%;--popover-foreground:222 25% 14%;
 --primary:236 81% 60%;--primary-foreground:0 0% 100%;--secondary:232 70% 97%;--secondary-foreground:236 61% 35%;
 --muted:220 17% 96%;--muted-foreground:222 11% 42%;--accent:86 75% 56%;--accent-foreground:222 25% 14%;
 --border:220 15% 90%;--input:220 15% 86%;--ring:236 81% 60%;--radius:.75rem;
 --gradient-primary:linear-gradient(120deg,#232C8F 0%,#3B48D6 58%,#5568FF 100%);
 --gradient-background:linear-gradient(180deg,#F3F4F7,#F3F4F7);
 --shadow-elegant:0 14px 30px -14px rgba(35,44,143,.55);--shadow-soft:0 1px 0 rgba(26,31,43,.04),0 10px 26px -18px rgba(35,44,143,.45);
}
html,body{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;background:#F3F4F7;color:#1A1F2B;-webkit-font-smoothing:antialiased}
/* barre du haut */
.okl-top{background:#fff;border-bottom:1px solid #E2E5EB}
.okl-top-in{max-width:1400px;margin:0 auto;padding:14px 32px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.okl-top img{height:30px;width:auto;display:block}
.okl-top a.okl-back{font-size:14px;font-weight:600;color:#232C8F;text-decoration:none;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;border:1px solid #E2E5EB}
.okl-top a.okl-back:hover{background:#EEF0FF;border-color:#C9CEFA}
.okl-top a:focus-visible{outline:3px solid #9BE33A;outline-offset:2px}
/* bandeau titre */
.container:has(> div > h1.bg-clip-text) > div:first-child,div:has(> h1.bg-clip-text){background:var(--gradient-primary);border-radius:24px;padding:40px 32px 36px;margin-bottom:28px;position:relative;overflow:hidden;box-shadow:var(--shadow-elegant)}
div:has(> h1.bg-clip-text)::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(155,227,58,.22),rgba(155,227,58,0) 70%);pointer-events:none}
h1.bg-clip-text{background:none!important;-webkit-text-fill-color:#fff;color:#fff!important;font-weight:800!important;letter-spacing:-.02em;font-size:clamp(28px,4vw,40px)!important;line-height:1.15!important;text-wrap:balance}
div:has(> h1.bg-clip-text) p{color:rgba(255,255,255,.88)!important;font-size:17px}
/* cartes */
.rounded-lg.border.bg-card{border-radius:20px!important;border-color:#E2E5EB!important;box-shadow:var(--shadow-soft)!important}
.shadow-elegant{box-shadow:var(--shadow-soft)!important}
h3,.text-2xl{letter-spacing:-.01em}
/* encart Bloom */
.bg-gradient-to-r.from-secondary{background:#F7F8FF!important;border:1px solid #DADEFB!important;border-radius:18px!important}
.border-l-4.text-center{background:#fff!important;border-top:1px solid #E2E5EB!important;border-right:1px solid #E2E5EB!important;border-bottom:1px solid #E2E5EB!important;border-left-width:5px!important;border-radius:14px!important;box-shadow:0 1px 0 rgba(26,31,43,.03)}
.border-l-4.border-primary{border-left-color:#4656EC!important}
/* champs */
input,textarea,button[role=combobox]{background:#fff!important;border-color:#D5D9E3!important;border-radius:10px!important;font-size:15px!important}
input:focus-visible,textarea:focus-visible,button[role=combobox]:focus-visible{outline:none!important;border-color:#4656EC!important;box-shadow:0 0 0 3px rgba(70,86,236,.2)!important}
input::placeholder,textarea::placeholder{color:#6B7385!important}
label{font-weight:600!important;color:#1A1F2B}
/* boutons */
button.bg-gradient-primary{background:var(--gradient-primary)!important;border-radius:12px!important;height:52px!important;font-size:16px!important;font-weight:700!important;letter-spacing:.01em}
button.bg-gradient-primary:hover{filter:brightness(1.07);box-shadow:var(--shadow-elegant)!important}
button.border.bg-background:not([role=combobox]){border-color:#C9CEFA!important;color:#232C8F!important;font-weight:600!important;border-radius:10px!important}
button.border.bg-background:not([role=combobox]):hover{background:#EEF0FF!important}
button:focus-visible{outline:3px solid #9BE33A!important;outline-offset:2px}
/* zone résultat */
.border-dashed{border-color:#C9CEFA!important;background:#F7F8FF!important;border-radius:18px!important}
footer{background:transparent!important;color:#6B7385!important}
@media (max-width:640px){.bg-gradient-to-r.from-secondary .grid{grid-template-columns:1fr!important}.border-l-4.text-center{text-align:left!important;padding:12px 14px!important}.border-l-4.text-center *{overflow-wrap:anywhere}.container{padding-left:12px!important;padding-right:12px!important}.rounded-lg.border.bg-card>.p-6,.rounded-lg.border.bg-card>div{padding-left:16px!important;padding-right:16px!important}.bg-gradient-to-r.from-secondary>div{padding-left:14px!important;padding-right:14px!important}.okl-top-in{padding:12px 16px}.okl-top img{height:24px}.okl-top a.okl-back{font-size:13px;padding:7px 12px}div:has(> h1.bg-clip-text){padding:28px 20px;border-radius:18px}}

/* mode d'emploi */
.okl-howto{max-width:1340px;margin:24px auto 0;padding:0 32px}
.okl-howto details{background:#fff;border:1px solid #E2E5EB;border-radius:20px;box-shadow:0 1px 0 rgba(26,31,43,.04),0 10px 26px -18px rgba(35,44,143,.45);padding:6px 24px}
.okl-howto summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:14px 0;font-weight:700;font-size:17px;color:#232C8F}
.okl-howto summary::-webkit-details-marker{display:none}
.okl-howto summary::after{content:"";margin-left:auto;width:10px;height:10px;border-right:2px solid #232C8F;border-bottom:2px solid #232C8F;transform:rotate(45deg);transition:transform .2s}
.okl-howto details[open] summary::after{transform:rotate(-135deg)}
.okl-howto summary:focus-visible{outline:3px solid #9BE33A;outline-offset:4px;border-radius:8px}
.okl-howto-ic{flex:0 0 32px;height:32px;border-radius:10px;background:linear-gradient(120deg,#232C8F,#5568FF);color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px}
.okl-steps{list-style:none;margin:4px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;counter-reset:st}
.okl-steps li{counter-increment:st;background:#F7F8FF;border:1px solid #E4E7FB;border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:6px;font-size:14px;line-height:1.5;color:#4A5263}
.okl-steps li::before{content:counter(st);width:30px;height:30px;border-radius:50%;background:#232C8F;color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:14px;margin-bottom:4px}
.okl-steps li:last-child::before{background:#9BE33A;color:#1A1F2B}
.okl-steps b{color:#1A1F2B;font-size:15px}
.okl-steps em{font-style:normal;font-weight:600;color:#232C8F}
.okl-howto-ex{margin:16px 0 18px;padding:14px 16px;border-left:4px solid #9BE33A;background:#F6FBEF;border-radius:10px;font-size:15px;line-height:1.6;color:#1A1F2B}
.okl-howto-ex b{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#4A5263;margin-bottom:2px}
.okl-howto-ex mark{background:#E8EBFF;color:#1A1F2B;padding:1px 4px;border-radius:4px}
@media (max-width:1100px){.okl-steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.okl-howto{padding:0 12px;margin-top:16px}.okl-howto details{padding:4px 16px}.okl-steps{grid-template-columns:1fr}.okl-howto summary{font-size:16px}}
