/* Start a project — "Discuss My Requirements" brief (Lead Gateway handoff), in the site's D2 style. */

/* ---------- welcome ---------- */
.pw{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:56px;align-items:center;margin-top:18px}
.pw-copy h1{font-size:clamp(40px,5.4vw,72px);line-height:1.02}
.pw-copy .tags{margin-top:20px}
.pw-proc{position:relative;background:var(--deep);color:var(--on-deep);border-radius:var(--radius-lg,20px);padding:30px 30px 26px;overflow:hidden;isolation:isolate}
.pw-proc::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:28px 28px}
.pw-k{font:700 12px var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}
.pw-rise{position:absolute;right:22px;top:20px;width:34px;height:34px}
.pw-proc ol{list-style:none;margin-top:22px;position:relative}
.pw-proc ol::before{content:"";position:absolute;left:19px;top:20px;bottom:20px;width:2px;background:linear-gradient(var(--gold),rgba(255,255,255,.18))}
.pw-proc li{position:relative;display:flex;gap:16px;align-items:center;padding:10px 0}
.pw-dot{flex:none;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font:700 13px var(--f-mono);background:#2a1a6e;color:#fff;border:2px solid rgba(255,255,255,.2);position:relative;z-index:1}
.pw-proc li:first-child .pw-dot{background:var(--gold);border-color:var(--gold);color:var(--ink)}
.pw-proc strong{display:block;color:#fff;font-size:17px}
.pw-proc small{color:var(--on-deep-2);font-size:13.5px}
.js-motion .pw-proc li{opacity:0;transform:translateX(14px);animation:pw-in .5s ease forwards;animation-delay:calc(.35s + var(--i) * .14s)}
@keyframes pw-in{to{opacity:1;transform:none}}
@media(max-width:900px){.pw{grid-template-columns:1fr;gap:30px}}

/* ---------- form layout: fixed purple rail + form surface ---------- */
.pbx{display:grid;grid-template-columns:minmax(0,35fr) minmax(0,65fr);border-radius:var(--radius-lg,20px);overflow:hidden;background:var(--surface);box-shadow:var(--shadow);margin-top:18px}
.pbx-rail{position:relative;background:var(--deep);color:var(--on-deep);padding:40px 34px;display:flex;flex-direction:column;overflow:hidden;isolation:isolate}
.pbx-rail::after{content:"";position:absolute;right:-90px;bottom:-90px;width:240px;height:240px;border-radius:50%;border:34px solid rgba(245,180,0,.12);z-index:-1}
.pbx-rail .eyebrow{color:var(--gold)}
.pbx-rail h2{color:#fff;font-size:clamp(24px,2.4vw,32px);line-height:1.15;margin-top:10px}
.pbx-steps{list-style:none;margin-top:34px;position:relative}
.pbx-steps::before{content:"";position:absolute;left:7px;top:12px;bottom:12px;width:2px;background:rgba(255,255,255,.18)}
.pbx-steps li{position:relative;display:flex;align-items:center;gap:14px;padding:11px 0;color:var(--on-deep-2);font-weight:600}
.pbx-steps i{flex:none;width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.35);background:var(--deep);position:relative;z-index:1}
.pbx-steps li.on{color:#fff;font-weight:800}
.pbx-steps li.on i{background:var(--gold);border-color:var(--gold);box-shadow:0 0 0 5px rgba(245,180,0,.2)}
.pbx-steps li.done i{background:#fff;border-color:#fff}
.pbx-slogan{margin-top:auto;padding-top:34px;font:700 13px var(--f-mono);color:var(--gold);letter-spacing:.04em}
.pbx-main{padding:40px 44px}
.pbx-main h2{font-size:clamp(24px,2.6vw,32px);margin:6px 0 4px}
.pbx-prog{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.pbx-prog span{font:700 12px var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--purple-ink)}
.pbx-bars{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.pbx-bars i{height:5px;border-radius:3px;background:var(--tint);transition:background .35s}
.pbx-bars i.on{background:var(--gold)}
.pbx-opt{font-weight:500;color:var(--ink-2);font-size:13px}
.pbx .field{margin-top:18px}
.pbx .frow{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.pbx .frow .field{margin-top:18px}
.pbx-when{max-width:340px}
.pbx [aria-invalid="true"]{border-color:#C4003A}

/* service cards (multi-select) */
.pbx-svc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:10px}
.pbx-card{position:relative;display:flex;justify-content:space-between;align-items:center;gap:10px;text-align:left;min-height:64px;padding:14px 16px;border-radius:12px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font:700 14.5px/1.3 var(--f-sans);cursor:pointer;transition:background .2s,border-color .2s,color .2s,transform .2s}
.pbx-card:hover{background:var(--tint);border-color:var(--purple);transform:translateY(-2px)}
.pbx-box{flex:none;width:20px;height:20px;border-radius:6px;border:2px solid var(--line);display:grid;place-items:center;transition:background .2s,border-color .2s}
.pbx-card[aria-pressed="true"]{background:var(--purple);border-color:var(--purple);color:#fff}
.pbx-card[aria-pressed="true"] .pbx-box{background:var(--gold);border-color:var(--gold)}
.pbx-card[aria-pressed="true"] .pbx-box::after{content:"";width:9px;height:5px;border:2.5px solid var(--ink);border-top:0;border-right:0;transform:translateY(-1px) rotate(-45deg)}
.pbx .chip:hover{border-color:var(--purple);background:var(--tint)}
.pbx .chip[aria-pressed="true"]{background:var(--purple);border-color:var(--purple);color:#fff}
.pbx-card:focus-visible,.pbx .chip:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

.pbx-nav{display:flex;justify-content:space-between;gap:12px;margin-top:30px;padding-top:22px;border-top:1px solid var(--line)}
.pbx-privacy{margin-top:12px;font-size:13px;color:var(--ink-2);text-align:right}

/* confirmation */
.pbx-done{text-align:left}
.pbx-tick svg{width:64px;height:64px;display:block}
.js-motion .pbx-tick svg{animation:pbx-pop .6s cubic-bezier(.3,1.6,.5,1) both}
@keyframes pbx-pop{from{transform:scale(.3);opacity:0}}
.pbx-done h2{margin-top:16px}
.pbx-done .lead{margin-top:8px}
.pbx-next{list-style:none;margin:24px 0 26px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pbx-next li{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:12px;background:var(--tint)}
.pbx-next span{font:700 12px var(--f-mono);color:var(--purple-ink);padding-top:3px}
.pbx-next p{font-weight:600;font-size:14.5px;color:var(--ink)}

/* mobile: compact horizontal step indicator replaces the rail */
.pbx-mini{display:none}
@media(max-width:860px){
  .pbx{grid-template-columns:1fr}
  .pbx-rail{display:none}
  .pbx-main{padding:24px 20px}
  .pbx-mini{display:flex;list-style:none;gap:6px;margin-bottom:18px}
  .pbx-mini li{flex:1;text-align:center;font:700 11px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);padding-top:8px;border-top:3px solid var(--tint)}
  .pbx-mini li.on{color:var(--purple-ink);border-top-color:var(--gold)}
  .pbx-svc{grid-template-columns:1fr 1fr}
  .pbx .frow{grid-template-columns:1fr;gap:0}
  .pbx-next{grid-template-columns:1fr}
  .pbx-nav .btn-primary{flex:1}
  .pbx-privacy{text-align:left}
}
@media(max-width:420px){.pbx-svc{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.js-motion .pw-proc li{opacity:1;transform:none;animation:none}.js-motion .pbx-tick svg{animation:none}}
