/* ============================================================
   Colour Outside — Ministry Sites onboarding wizard
   Self-contained styles. Scoped under #co-wizard-root.
   Tokens are authoritative (from CO design system).
   ============================================================ */
#co-wizard-root{
  --font-display:"itc-avant-garde-gothic-pro","Avant Garde","Century Gothic","Futura",sans-serif;
  --font-body:"freight-text-pro","Freight Text",Georgia,"Times New Roman",serif;

  --co-white:#ffffff;
  --co-midnight:#212529;
  --co-rogue-pink:#ea008a;
  --co-pink-100:#fbd0e8; --co-pink-300:#f45cb2; --co-pink-500:#ea008a; --co-pink-700:#b0006a; --co-pink-900:#56002b;
  --co-twilight:#07334f; --co-twilight-100:#cdd9e0; --co-twilight-300:#3a6a86; --co-twilight-500:#07334f; --co-twilight-700:#051f30;
  --co-ink-050:#f5f6f7; --co-ink-100:#e7e9eb; --co-ink-300:#adb3b9; --co-ink-500:#6b7178; --co-ink-700:#3a4046; --co-ink-900:#212529;

  --text-body:var(--co-ink-700); --text-muted:var(--co-ink-500); --text-strong:var(--co-midnight);
  --border-subtle:var(--co-ink-100);

  --radius-sm:4px; --radius-md:8px; --radius-lg:16px; --radius-pill:999px;
  --shadow-sm:0 1px 2px rgba(33,37,41,.08);
  --shadow-md:0 8px 24px rgba(33,37,41,.10);
  --shadow-lg:0 24px 60px rgba(7,51,79,.18);
  --shadow-pink:0 12px 30px rgba(234,0,138,.28);
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-standard:cubic-bezier(.22,.61,.36,1);

  --co-gradient:linear-gradient(115deg,var(--co-rogue-pink) 0%,var(--co-pink-900) 55%,var(--co-twilight) 100%);
  --co-gradient-pink:linear-gradient(115deg,#f45cb2 0%,var(--co-rogue-pink) 55%,var(--co-pink-900) 100%);

  --container-max:1200px;

  font-family:var(--font-body);
  color:var(--text-body);
  -webkit-font-smoothing:antialiased;
  box-sizing:border-box;
}
#co-wizard-root *,#co-wizard-root *::before,#co-wizard-root *::after{box-sizing:border-box}
#co-wizard-root ::selection{background:var(--co-pink-100)}
#co-wizard-root input,#co-wizard-root textarea,#co-wizard-root button{font-family:inherit}
#co-wizard-root input::placeholder,#co-wizard-root textarea::placeholder{color:var(--co-ink-300)}
#co-wizard-root input:focus,#co-wizard-root textarea:focus{border-color:var(--co-rogue-pink)!important;outline:none}

@keyframes coUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes coPop{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}

#co-wizard-root .co-ico{display:inline-block;flex:none;vertical-align:middle}

/* fill-sweep button (signature CO hover) */
#co-wizard-root .btnfx{background:transparent;border:2px solid var(--stroke);color:var(--txt);
  box-shadow:inset 0 0 0 0 var(--fill);transition:box-shadow .62s var(--ease-out),color .3s var(--ease-out);cursor:pointer}
#co-wizard-root .btnfx:hover{box-shadow:inset 520px 0 0 0 var(--fill);color:var(--txth)}
#co-wizard-root .btnfx:active{box-shadow:inset 520px 0 0 0 var(--fill)}
#co-wizard-root .recfx:hover span{color:#fff!important}

@media (prefers-reduced-motion:reduce){
  #co-wizard-root .btnfx{transition:color .2s}
  #co-wizard-root [data-anim]{animation:none!important}
}

/* layout helpers */
#co-wizard-root .co-screen{min-height:100vh}
#co-wizard-root .co-wizard-bg{background:linear-gradient(180deg,var(--co-ink-050) 0%,rgba(234,0,138,.09) 48%,rgba(7,51,79,.16) 100%)}

#co-wizard-root .co-head{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.92);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--border-subtle)}
#co-wizard-root .co-head-in{max-width:760px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px}
#co-wizard-root .co-badge{font-family:var(--font-display);font-weight:600;font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--co-pink-700);background:var(--co-pink-100);padding:5px 12px;border-radius:var(--radius-pill);white-space:nowrap}
#co-wizard-root .co-progress{flex:1;height:6px;background:var(--co-ink-100);border-radius:99px;overflow:hidden}
#co-wizard-root .co-progress > i{display:block;height:100%;background:var(--co-gradient-pink);border-radius:99px;transition:width .4s var(--ease-out)}
#co-wizard-root .co-linkbtn{font-family:var(--font-display);font-weight:600;font-size:13px;color:var(--text-muted);background:none;border:none;cursor:pointer}

#co-wizard-root .co-main{max-width:760px;width:100%;margin:0 auto;padding:44px 24px 170px}
#co-wizard-root .co-eyebrow{font-family:var(--font-display);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--co-rogue-pink)}
#co-wizard-root .co-h1{font-family:var(--font-display);font-weight:600;font-size:38px;line-height:1.1;letter-spacing:-.02em;color:var(--co-midnight);margin:12px 0 6px}
#co-wizard-root .co-micro{font-family:var(--font-body);font-size:17px;line-height:1.55;color:var(--text-body);margin:0 0 28px;max-width:560px}
#co-wizard-root .co-label{font-family:var(--font-display);font-weight:600;font-size:13px;color:var(--co-midnight)}
#co-wizard-root .co-input,#co-wizard-root .co-textarea{font-family:var(--font-body);font-size:16px;color:var(--co-midnight);background:#fff;
  padding:14px 16px;border:1.5px solid var(--co-ink-100);border-radius:var(--radius-md);outline:none;width:100%}
#co-wizard-root .co-textarea{min-height:92px;resize:vertical;line-height:1.5;border-width:2px;border-radius:var(--radius-lg);padding:14px 16px}

#co-wizard-root .co-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
#co-wizard-root .co-grid-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
#co-wizard-root .co-col{display:flex;flex-direction:column}

/* footer nav */
#co-wizard-root .co-foot{position:fixed;bottom:0;left:0;right:0;z-index:45;background:rgba(255,255,255,.94);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--border-subtle)}
#co-wizard-root .co-foot-in{max-width:760px;margin:0 auto;padding:14px 24px;display:flex;align-items:center;gap:16px}

/* summary */
#co-wizard-root .co-sum-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:start}
#co-wizard-root .co-card{background:#fff;border:1px solid var(--border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);padding:22px 24px}

/* responsive */
@media (max-width:720px){
  #co-wizard-root .co-h1{font-size:30px}
  #co-wizard-root .co-grid-2,#co-wizard-root .co-grid-3{grid-template-columns:1fr}
  #co-wizard-root .co-sum-grid{grid-template-columns:1fr}
  #co-wizard-root .co-foot-in{gap:10px;padding:12px 16px}
  #co-wizard-root .co-foot .co-skip{display:none}
}
