/* OkapPower Partenaires · formulaire public · Développé par Inno100 (inno100.tech) */
.okpp{
	--okpp-y:var(--y,#E9B90B);
	--okpp-ink:var(--ink,#0B0B0C);
	--okpp-card:var(--card,#141416);
	--okpp-line:rgba(255,255,255,.14);
	--okpp-text:#F4F4F5;
	--okpp-mute:rgba(255,255,255,.68);
	--okpp-err:#FF8A80;
	--okpp-ok:#7BE3A0;
	--okpp-display:var(--display,'Manrope',system-ui,sans-serif);
	--okpp-sans:var(--sans,'Inter',system-ui,sans-serif);
	--okpp-ease:cubic-bezier(.2,.7,.3,1);
	max-width:960px;margin:0 auto;padding:clamp(32px,6vw,72px) 0;color:var(--okpp-text);font-family:var(--okpp-sans);font-size:16px;line-height:1.55
}
.okpp *,.okpp *::before,.okpp *::after{box-sizing:border-box}
.okpp-form-page .page-wrap>article>h1{display:none}
.okpp-form-page .okpp{padding-top:0}

/* En-tête */
.okpp-eyebrow{font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--okpp-y)}
.okpp-title{margin:10px 0 12px;font-family:var(--okpp-display);font-weight:800;font-size:clamp(32px,5vw,56px);line-height:1.02;text-transform:uppercase;color:#fff}
.okpp-lead{max-width:62ch;margin:0;color:var(--okpp-mute);font-size:17px}
.okpp-muted{color:var(--okpp-mute)}
.okpp-small{font-size:13px;margin:0}

/* Résumé des erreurs */
.okpp-summary{margin:28px 0 0;padding:16px 18px;border:1px solid var(--okpp-err);background:rgba(255,138,128,.08);outline:none}
.okpp-summary p{margin:0 0 6px;color:#fff}
.okpp-summary ul{margin:0;padding-left:18px}
.okpp-summary a{color:var(--okpp-err);text-decoration:underline;text-underline-offset:3px}

/* Étapes */
.okpp-form{margin-top:36px;display:grid;gap:22px}
.okpp-step{margin:0;padding:clamp(18px,3vw,28px);border:1px solid var(--okpp-line);background:var(--okpp-card);min-width:0}
.okpp-step legend{display:flex;align-items:center;gap:12px;padding:0 8px;margin-left:-8px;font-family:var(--okpp-display);font-weight:800;font-size:clamp(18px,2.2vw,22px);text-transform:uppercase;color:#fff}
.okpp-num{display:inline-grid;place-items:center;width:30px;height:30px;background:var(--okpp-y);color:var(--okpp-ink);font-size:15px;font-weight:800}

/* Packs */
.okpp-packs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px;margin-top:6px}
.okpp-pack{position:relative;display:block;cursor:pointer}
.okpp-pack input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.okpp-pack-card{display:flex;flex-direction:column;gap:10px;height:100%;padding:18px;border:1.5px solid var(--okpp-line);background:rgba(255,255,255,.03);transition:border-color .2s var(--okpp-ease),background-color .2s var(--okpp-ease)}
.okpp-pack:hover .okpp-pack-card{border-color:rgba(233,185,11,.55)}
.okpp-pack input:focus-visible+.okpp-pack-card{outline:3px solid var(--okpp-y);outline-offset:3px}
.okpp-pack input:checked+.okpp-pack-card{border-color:var(--okpp-y);background:rgba(233,185,11,.1)}
.okpp-pack-top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:22px}
.okpp-pack-top small{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--okpp-mute)}
.okpp-tag{padding:3px 8px;background:var(--okpp-y);color:var(--okpp-ink);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.okpp-pack-name{font-family:var(--okpp-display);font-weight:800;font-size:22px;text-transform:uppercase;color:#fff;line-height:1.1}
.okpp-perks{display:grid;gap:7px;font-size:14px;color:var(--okpp-mute)}
.okpp-perk{display:flex;gap:8px;align-items:flex-start}
.okpp-perk svg{flex:none;margin-top:3px;color:var(--okpp-y)}
.okpp-pick{margin-top:auto;padding-top:8px;font-size:13px;font-weight:700;color:var(--okpp-mute)}
.okpp-pick-on{display:none;color:var(--okpp-y)}
.okpp-pack input:checked+.okpp-pack-card .okpp-pick-on{display:inline}
.okpp-pack input:checked+.okpp-pack-card .okpp-pick-off{display:none}
.okpp-pack--undecided .okpp-pack-card{border-style:dashed}
.okpp-pack--undecided .okpp-pack-name{font-size:18px}

/* Champs */
.okpp-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px;margin-top:6px}
.okpp-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.okpp-field--full{grid-column:1/-1}
.okpp-field>label,.okpp-label{font-size:14px;font-weight:600;color:#fff}
.okpp-req{color:var(--okpp-y)}
.okpp input[type=text],.okpp input[type=email],.okpp input[type=tel],.okpp input[type=url],.okpp textarea{
	width:100%;min-height:48px;padding:12px 14px;border:1.5px solid var(--okpp-line);border-radius:0;background:var(--okpp-ink);color:#fff;font:inherit;font-size:16px;transition:border-color .15s var(--okpp-ease),box-shadow .15s var(--okpp-ease);-webkit-appearance:none;appearance:none
}
.okpp textarea{min-height:130px;resize:vertical}
.okpp input::placeholder,.okpp textarea::placeholder{color:rgba(255,255,255,.4)}
.okpp input:hover,.okpp textarea:hover{border-color:rgba(255,255,255,.3)}
.okpp input:focus,.okpp textarea:focus{outline:none;border-color:var(--okpp-y);box-shadow:0 0 0 3px rgba(233,185,11,.28)}
.okpp [aria-invalid=true]{border-color:var(--okpp-err)!important}
.okpp-help{margin:0;font-size:13px;color:var(--okpp-mute)}
.okpp-err{display:flex;gap:6px;margin:0;font-size:13.5px;font-weight:600;color:var(--okpp-err)}
.okpp-err::before{content:"!";flex:none;display:inline-grid;place-items:center;width:17px;height:17px;margin-top:1px;border-radius:50%;background:var(--okpp-err);color:var(--okpp-ink);font-size:11px;font-weight:900}

/* Logo */
.okpp-drop{position:relative;display:flex;align-items:center;gap:16px;min-height:96px;padding:16px;border:1.5px dashed rgba(255,255,255,.28);background:var(--okpp-ink);cursor:pointer;transition:border-color .2s var(--okpp-ease),background-color .2s var(--okpp-ease)}
.okpp-drop:hover,.okpp-drop.is-over{border-color:var(--okpp-y);background:rgba(233,185,11,.06)}
.okpp-drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.okpp-drop:focus-within{outline:3px solid var(--okpp-y);outline-offset:3px}
.okpp-drop-text{display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center;font-size:14px;color:var(--okpp-mute)}
.okpp-drop-text svg{grid-row:span 2;color:var(--okpp-y)}
.okpp-drop-text strong{color:#fff;word-break:break-all}
.okpp-drop-preview{flex:none;display:grid;place-items:center;width:84px;height:64px;background:#fff;padding:6px}
.okpp-drop-preview[hidden]{display:none}
.okpp-drop-preview img{max-width:100%;max-height:100%;object-fit:contain}

/* Pied */
.okpp-foot{display:grid;gap:16px;justify-items:start}
.okpp-check{display:flex;gap:12px;align-items:flex-start;min-height:44px;cursor:pointer;font-size:15px;color:#fff}
.okpp-check input{flex:none;width:22px;height:22px;margin:1px 0 0;accent-color:var(--okpp-y);cursor:pointer}
.okpp-check input:focus-visible{outline:3px solid var(--okpp-y);outline-offset:2px}
.okpp-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 30px;border:0;background:var(--okpp-y);color:var(--okpp-ink);font-family:var(--okpp-display);font-weight:800;font-size:16px;text-transform:uppercase;letter-spacing:.04em;text-decoration:none;cursor:pointer;touch-action:manipulation;transition:transform .15s var(--okpp-ease),filter .15s var(--okpp-ease)}
.okpp-btn:hover{filter:brightness(1.07)}
.okpp-btn:active{transform:scale(.98)}
.okpp-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.okpp-btn[disabled]{opacity:.6;cursor:progress}
.okpp-btn--ghost{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.4)}
.okpp-spin{display:none;width:18px;height:18px;border:2.5px solid rgba(11,11,12,.3);border-top-color:var(--okpp-ink);border-radius:50%;animation:okpp-spin .7s linear infinite}
.okpp-btn.is-loading .okpp-spin{display:inline-block}
@keyframes okpp-spin{to{transform:rotate(360deg)}}
.okpp-live{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.okpp-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* Succès */
.okpp-done{display:grid;justify-items:start;gap:12px;padding:clamp(24px,5vw,48px);border:1px solid rgba(123,227,160,.4);background:var(--okpp-card);outline:none}
.okpp-done h2{margin:0;font-family:var(--okpp-display);font-weight:800;font-size:clamp(28px,4vw,42px);text-transform:uppercase;color:#fff}
.okpp-done p{margin:0;max-width:60ch}
.okpp-done-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--okpp-ok);color:var(--okpp-ink)}
.okpp-done .okpp-btn{margin-top:8px}

@media (max-width:640px){
	.okpp-grid{grid-template-columns:1fr}
	.okpp-btn{width:100%}
	.okpp-foot{justify-items:stretch}
}
@media (prefers-reduced-motion:reduce){
	.okpp *{transition:none!important;animation:none!important}
	.okpp-btn.is-loading .okpp-spin{display:none}
}
