/* Shared block palette, section separation and button treatment for the process pages. */
:root{
  --p-lavender:#dcd6ff; --p-sky:#cfe4ff; --p-peach:#ffd9c2; --p-mint:#d1ffca; --p-volt:#fff100;
  --p-cobalt:#2438ff; --p-cobalt-2:#1b2bd6; --p-ink:#000; --p-paper:#fff;
}

/* ── Sections as colored blocks ─────────────────────────── */
section[id]{background:var(--p-tint,transparent);border-radius:40px;padding:clamp(28px,5vw,56px);margin-bottom:32px!important}
section[id] > span:first-child{display:inline-block;background:var(--p-ink)!important;color:var(--p-paper)!important;padding:8px 14px;border-radius:64px}
/* per-page tint rotation */
#commitments,#others,#rules,#tracks,#method{--p-tint:var(--p-lavender)}
#phases,#ambiguity,#proof,#skills,#limits{--p-tint:var(--p-sky)}
#cadence,#practice,#anatomy,#examples,#governance{--p-tint:var(--p-peach)}
#handoff,#first-30,#sequence,#demo{--p-tint:var(--p-mint)}
#artifacts{background:transparent;padding:0;margin-bottom:24px!important}
/* rows and tables inside tinted blocks keep white surfaces; the grey table header rows go white too */
section[id] [style*="background:#f3f3f3"]{background:var(--p-paper)!important}

/* ── Buttons ────────────────────────────────────────────── */
/* card link-lines on the front page become pills */
#artifacts a[class^="hv"] > span:last-child{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;background:var(--p-ink);color:var(--p-paper);padding:12px 20px;border-radius:64px;font-size:14px;transition:background .15s,transform .15s}
#artifacts a[class^="hv"]:hover > span:last-child{background:var(--p-cobalt);transform:translateX(2px)}
#artifacts a[class^="hv"][style*="background:#000000"] > span:last-child{background:var(--p-mint);color:var(--p-ink)}
#artifacts a[class^="hv"][style*="background:#000000"]:hover > span:last-child{background:var(--p-volt)}
/* small file cards: the title line reads as the action */
section[aria-label="Files and examples"] a > span:nth-child(2){text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
section[aria-label="Files and examples"] a > span:nth-child(2)::after{content:" →";font-family:"JetBrains Mono",ui-monospace,monospace;font-size:14px}
/* closing block links */
a[href^="mailto:"]{display:inline-block;padding:14px 22px!important;border-radius:64px!important;font-size:16px;font-weight:500;background:var(--p-volt)!important;color:var(--p-ink)!important}
a[href^="mailto:"]:hover{background:var(--p-mint)!important}
section:not([id]) a[href="https://mikelrosenthal.com"]{display:inline-block;padding:12px 20px;border:1.5px solid rgba(255,255,255,.6);border-radius:64px;color:#fff}
section:not([id]) a[href="https://mikelrosenthal.com"]:hover{background:#fff;color:#000}
/* in-page nav pill: stronger hover */
nav a:hover{background:var(--p-volt)!important;color:#000!important}

/* ── Intake form specifics ──────────────────────────────── */
.step > div:first-child{background:var(--p-tint,var(--p-lavender));margin:calc(-1*clamp(28px,4vw,40px)) calc(-1*clamp(28px,4vw,40px)) 0;padding:clamp(28px,4vw,40px);border-radius:32px 32px 0 0}
.step[data-step="0"],.step[data-step="4"]{--p-tint:var(--p-lavender)}
.step[data-step="1"],.step[data-step="5"]{--p-tint:var(--p-sky)}
.step[data-step="2"],.step[data-step="6"]{--p-tint:var(--p-peach)}
.step[data-step="3"],.step[data-step="7"]{--p-tint:var(--p-mint)}
.step > div:first-child .kick{display:inline-block;background:var(--p-ink);color:var(--p-paper);padding:8px 14px;border-radius:64px}
.step[data-step="7"] .toolbar{background:var(--p-mint);margin:calc(-1*clamp(28px,4vw,40px)) calc(-1*clamp(28px,4vw,40px)) 0;padding:clamp(28px,4vw,40px);border-radius:32px 32px 0 0}
.btn{font-size:17px!important;padding:16px 28px!important;box-shadow:0 0 0 0 transparent;transition:background .15s,transform .15s,box-shadow .15s}
.btn:hover{transform:translateY(-1px)}
#next{background:var(--p-ink);color:var(--p-paper)}
#next:hover{background:var(--p-cobalt)}
#sample{background:var(--p-cobalt)!important;color:var(--p-paper)!important}
#sample:hover{background:var(--p-cobalt-2)!important}
#prev,#reset,#print{background:transparent!important;color:var(--p-ink)!important;box-shadow:inset 0 0 0 1.5px var(--p-ink)}
#prev:hover,#reset:hover,#print:hover{background:var(--p-ink)!important;color:var(--p-paper)!important}
#copy{background:var(--p-volt)!important;color:var(--p-ink)!important}
#copy:hover{background:var(--p-ink)!important;color:var(--p-paper)!important}
.actions{border-top:0!important;padding-top:8px}
.add{background:var(--p-cobalt)!important;color:var(--p-paper)!important;font-size:14px;padding:12px 18px!important;border-radius:64px!important}
.add:hover{background:var(--p-cobalt-2)!important}
.rail button[aria-current="step"]{background:var(--p-cobalt)!important}
.rail button.done .n::after{color:var(--p-cobalt)}
.rail button[aria-current="step"].done .n::after{color:var(--p-volt)}
.bank .q:hover{background:var(--p-volt)!important}
.choice input:checked+span{background:var(--p-cobalt)!important;border-color:var(--p-cobalt)!important}
