*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--sh-studio-black);color:var(--shp-ink-2);font-family:var(--shp-font-body);font-weight:var(--sh-w-regular);font-size:var(--sh-size-base);line-height:1.6;-webkit-font-smoothing:antialiased}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;letter-spacing:inherit}
input{font:inherit;color:inherit}
a{color:inherit;text-decoration:none}
a:hover{color:var(--shp-live)}
:focus-visible{outline:2px solid var(--shp-live);outline-offset:2px}
.field input:focus-visible{outline:none}
/* ── stage: full-bleed imagery, opaque plate on top ─────────── */
.stage{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--shp-gap-7) var(--shp-gutter-phone)}
.stage .bg{position:absolute;inset:0;overflow:hidden}
.stage .bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(10%)}
.stage .bg::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,rgba(10,10,10,0.45),rgba(10,10,10,0.28) 45%,rgba(10,10,10,0.62)),radial-gradient(ellipse at center,rgba(10,10,10,0) 30%,rgba(10,10,10,0.45))}
/* the card IS the opaque cream plate — type never touches the photograph */
.card{position:relative;z-index:3;width:100%;max-width:420px;padding:var(--shp-gap-6) var(--shp-gap-6) var(--shp-gap-4);background:var(--shp-card);border-radius:var(--shp-radius)}
.card__head{display:flex;justify-content:center;margin-bottom:var(--shp-gap-6)}
.wordmark{font-family:var(--shp-font-mark);font-weight:var(--sh-w-heavy);font-size:var(--shp-size-mark);line-height:1;text-transform:none;letter-spacing:var(--sh-track-mark);color:var(--shp-ink);text-align:center}
.wordmark .tag{display:block;margin-top:var(--shp-gap-1);font-family:var(--shp-font-mono);font-weight:var(--sh-w-regular);font-size:var(--sh-size-xs);letter-spacing:var(--sh-track-eyebrow);text-transform:uppercase;color:var(--shp-label)}
.card__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--shp-gap-1);margin-top:var(--shp-gap-6);padding-top:var(--shp-gap-2);border-top:1px solid var(--shp-rule-c)}
.card__foot span,.card__foot a{font-family:var(--shp-font-mono);font-size:var(--sh-size-xs);letter-spacing:var(--sh-track-mono);text-transform:uppercase;color:var(--shp-label)}
.card__foot a:hover{color:var(--shp-live)}
/* ── client identity ────────────────────────────────────────── */
.client-id{display:flex;align-items:center;gap:var(--shp-gap-2);margin-bottom:var(--shp-gap-4)}
.client-id .eyebrow{flex-shrink:0;font-family:var(--shp-font-mono);font-size:var(--sh-size-xs);letter-spacing:var(--sh-track-eyebrow);text-transform:uppercase;color:var(--shp-ink-2);white-space:nowrap}
.client-id .rule{flex:1;height:1px;background:var(--shp-rule-c)}
.client-id .portal{flex-shrink:0;font-family:var(--shp-font-mono);font-size:var(--sh-size-xs);letter-spacing:var(--sh-track-eyebrow);text-transform:uppercase;color:var(--shp-ink-2);white-space:nowrap}
h1{font-family:var(--shp-font-display);font-weight:var(--sh-w-regular);font-size:var(--sh-size-3xl);line-height:1.05;letter-spacing:var(--sh-track-display);color:var(--shp-ink);text-align:center}
.lede{margin-top:var(--shp-gap-1);font-family:var(--shp-font-mono);font-size:var(--sh-size-sm);letter-spacing:var(--sh-track-caption);text-transform:uppercase;line-height:1.7;color:var(--shp-label);text-align:center}
/* ── form ───────────────────────────────────────────────────── */
form{display:flex;flex-direction:column;gap:var(--shp-gap-3);margin-top:var(--shp-gap-4)}
.field{display:flex;flex-direction:column;gap:var(--shp-gap-1)}
.field label{font-family:var(--shp-font-mono);font-size:var(--sh-size-sm);letter-spacing:var(--sh-track-caption);text-transform:uppercase;color:var(--shp-label)}
.field input{background:transparent;border:0;border-bottom:1px solid var(--shp-ink-2);outline:0;padding:var(--shp-gap-1) 0;font-size:var(--sh-size-lead);color:var(--shp-ink);transition:border-color var(--shp-dur) var(--shp-ease),box-shadow var(--shp-dur) var(--shp-ease)}
.field input::placeholder{color:var(--sh-placeholder)}
.field input:focus{border-bottom-color:var(--shp-live);box-shadow:0 1px 0 var(--shp-live)}
.field.is-err input{border-bottom-color:var(--shp-live);box-shadow:0 1px 0 var(--shp-live)}
.err{display:none;align-items:baseline;gap:var(--shp-gap-1);font-size:var(--sh-size-md);line-height:1.5;color:var(--shp-live)}
.err.is-on{display:flex}
.err::before{content:"";width:5px;height:5px;border-radius:var(--shp-radius-pill);background:var(--shp-live);flex-shrink:0;transform:translateY(-2px)}
.btn{display:flex;align-items:center;justify-content:center;gap:var(--shp-gap-2);width:100%;padding:var(--shp-gap-2);background:var(--shp-fill);color:var(--shp-on-fill);border:1px solid var(--shp-fill);border-radius:var(--shp-radius-pill);font-family:var(--shp-font-mono);font-size:var(--sh-size-sm);letter-spacing:var(--sh-track-caption);text-transform:uppercase;transition:background var(--shp-dur) var(--shp-ease),border-color var(--shp-dur) var(--shp-ease),opacity var(--shp-dur) var(--shp-ease),transform 120ms var(--shp-ease-out)}
.btn:hover{background:var(--shp-press);border-color:var(--shp-press)}
.btn:active{transform:scale(var(--shp-press-scale))}
.btn:disabled{opacity:0.45;cursor:default;pointer-events:none}
.btn .arrow{position:relative;width:var(--shp-size-icon);height:1px;background:currentColor}
.btn .arrow::after{content:"";position:absolute;right:0;top:-3px;width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.help{display:flex;flex-direction:column;gap:var(--shp-gap-1);margin-top:var(--shp-gap-3)}
.help span{font-size:var(--sh-size-md);line-height:1.5;color:var(--shp-muted)}
.help a{align-self:flex-start;padding-bottom:2px;font-size:var(--sh-size-md);color:var(--shp-ink-2);border-bottom:1px solid var(--shp-rule-c);transition:color var(--shp-dur) var(--shp-ease),border-color var(--shp-dur) var(--shp-ease)}
.help a:hover{color:var(--shp-live);border-color:var(--shp-live)}
.help--sent{margin-top:var(--shp-gap-6)}
.state{display:none}
.state.is-on{display:block}
@media (prefers-reduced-motion:reduce){.btn:active{transform:none}}
@media (max-width:920px){
.stage{padding:var(--shp-gap-4) var(--shp-gap-2)}
.card{padding:var(--shp-gap-4) var(--shp-gap-3) var(--shp-gap-3);max-width:440px}
h1{font-size:var(--sh-size-xl)}
}
/* tweaks */
.tweaks{position:fixed;bottom:var(--shp-gap-3);right:var(--shp-gap-3);z-index:300;width:var(--shp-rail);background:var(--sh-studio-black);color:var(--sh-warm-cream);border-radius:var(--shp-radius);overflow:hidden;box-shadow:var(--sh-shadow-menu)}
.tweaks[hidden]{display:none}
.tweaks__head{display:flex;align-items:center;justify-content:space-between;padding:var(--shp-gap-1) var(--shp-gap-2);border-bottom:1px solid var(--sh-deep-black)}
.tweaks__head span{font-family:var(--shp-font-mono);font-size:var(--sh-size-xs);letter-spacing:var(--sh-track-eyebrow);text-transform:uppercase;color:var(--sh-linen)}
.tweaks__close{width:var(--shp-gap-3);height:var(--shp-gap-3);display:flex;align-items:center;justify-content:center;color:var(--sh-linen)}
.tweaks__body{display:flex;flex-direction:column;gap:var(--shp-gap-2);padding:var(--shp-gap-2)}
.tweak{display:flex;flex-direction:column;gap:var(--shp-gap-1)}
.tweak__label{font-family:var(--shp-font-mono);font-size:var(--sh-size-xs);letter-spacing:var(--sh-track-eyebrow);text-transform:uppercase;color:var(--sh-text-muted-on-black)}
.tweak__seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;border:1px solid var(--sh-deep-black)}
.tweak__seg button{padding:var(--shp-gap-1) 0;border-left:1px solid var(--sh-deep-black);font-family:var(--shp-font-mono);font-size:var(--sh-size-xs);letter-spacing:var(--sh-track-mono);text-transform:uppercase;color:var(--sh-linen)}
.tweak__seg button:first-child{border-left:0}
.tweak__seg button.is-on{background:var(--sh-warm-cream);color:var(--sh-studio-black)}