body { padding: 0 24px 64px; }
body::before { pointer-events: none; }
.bar { max-width: 1120px; }
.project-layout { position: relative; width: 100%; max-width: 1120px; margin: 56px auto 0; display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: clamp(32px,6vw,84px); align-items: start; }
.project-layout [hidden] { display: none !important; }
.project-intro h1 { font: 900 clamp(42px,4.7vw,68px)/1.03 var(--display); letter-spacing: -.035em; margin: 12px 0 24px; }
.project-intro > p { font-size: 19px; color: var(--muted); max-width: 34ch; line-height: 1.6; }
.project-alternatives { display: grid; justify-items: start; gap: 8px; margin-top: 36px; }
.project-alternatives a { display: inline-flex; gap: 12px; align-items: center; min-height: 44px; color: var(--accent-text); font-weight: 600; text-underline-offset: 5px; }
.project-panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-card); padding: clamp(22px,3vw,36px); }
.project-panel fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.project-required { margin: 0 0 24px; color: var(--muted); font-size: 15px; line-height: 1.55; }
.project-panel label { display: block; font-size: 15px; font-weight: 600; }
.project-panel label > span { color: var(--accent-text); }
.project-panel input, .project-panel textarea, .project-panel select { display: block; width: 100%; min-width: 0; min-height: 48px; margin: 8px 0 20px; padding: 12px; border: 1px solid var(--quiet); border-radius: 8px; background: var(--paper); color: var(--ink); font: 400 16px/1.45 var(--body); }
.project-panel textarea { min-height: 150px; resize: vertical; margin-bottom: 8px; }
.project-panel input::placeholder { color: var(--muted); opacity: 1; }
.project-panel :is(input,textarea,select):focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.project-panel [aria-invalid="true"] { border-color: var(--bad); }
.project-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.project-hint, .project-privacy { color: var(--muted); font-size: 14px; line-height: 1.5; margin: 0; }
.project-details { margin: 24px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.project-details summary { min-height: 52px; padding: 14px 0; cursor: pointer; font-weight: 600; }
.project-details summary span { color: var(--muted); font-weight: 400; }
.project-extra { padding: 8px 0 0; }
.project-panel .project-hp { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); }
.project-challenge:empty { display: none; }
.project-error { color: var(--bad); font-weight: 500; line-height: 1.5; margin: 0 0 18px; }
.project-panel .btn { min-height: 48px; white-space: normal; text-align: center; }
#projectSubmit { width: 100%; }
.project-privacy { margin-top: 16px; }
.project-privacy a { color: var(--accent-text); text-underline-offset: 3px; }
.project-success h2 { font: 600 36px/1.15 var(--display); letter-spacing: -.025em; margin: 0 0 20px; }
.project-success p { color: var(--muted); line-height: 1.6; }
.project-success .btn { margin-top: 16px; }
.project-return { display: block; margin-top: 20px; color: var(--accent-text); min-height: 44px; padding: 10px 0; }
@media (max-width: 800px) { .project-layout { grid-template-columns: minmax(0,1fr); gap: 28px; margin-top: 28px; max-width: 580px; } .project-intro h1 { font-size: clamp(42px,8vw,58px); } .project-intro h1 br { display: none; } .project-intro > p { max-width: 42ch; margin-bottom: 16px; } .project-alternatives { margin-top: 12px; gap: 0; } }
@media (max-width: 450px) { body { padding-inline: 20px; } .project-pair { grid-template-columns: minmax(0,1fr); gap: 0; } .project-panel { padding: 22px 20px; } .project-layout { margin-top: 20px; } }
