/* the family's pages: questionnaire, proof, voice notes (on top of album.css) */
.card{background:var(--paper);border-radius:16px;padding:30px 32px;margin:22px 0;box-shadow:0 18px 40px -30px rgba(60,40,20,.5)}
.card h2{font-size:32px;margin-bottom:4px}.card>p.soft{margin-top:0}
.card label{display:block;margin:16px 0 0;font:600 16px var(--sans);color:var(--soft)}
.card input,.card textarea,.card select{display:block;width:100%;margin-top:6px;font:18px/1.5 var(--sans);padding:12px 14px;border:1.5px solid #e2d8c6;border-radius:12px;background:#fff;color:var(--ink)}
.card textarea{resize:vertical}
.card input:focus,.card textarea:focus,.card select:focus{outline:2px solid var(--sage);border-color:var(--green)}
.notice{background:#e7efe2;border-radius:14px;padding:18px 22px;margin:18px 0;font-size:18px}
.steps{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 4px}.steps a{font:600 14px var(--sans);text-decoration:none;color:var(--green);background:var(--paper);border-radius:999px;padding:7px 14px;box-shadow:0 0 0 1px rgba(74,102,80,.25)}
.drop{display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:2px dashed #d8cbb2;border-radius:16px;padding:30px;cursor:pointer;margin-top:16px;text-align:center;color:var(--soft)!important}
.drop b{font:600 20px var(--sans);color:var(--green)}.drop.on{border-color:var(--green);background:#f1f5ee}
.photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin-top:18px}
.ph{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 10px 24px -18px rgba(0,0,0,.5);display:flex;flex-direction:column}
.ph img{width:100%;aspect-ratio:4/3;object-fit:cover;background:#eee}
.ph .meta{padding:10px;display:flex;flex-direction:column;gap:6px}.ph .meta input,.ph .meta textarea,.ph .meta select{margin:0;font-size:15px;padding:8px 10px}
.x{align-self:flex-start;border:0;background:none;color:#a0473c;font:600 14px var(--sans);cursor:pointer;padding:4px 0}
.rec{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-top:12px}
.voices{display:flex;flex-direction:column;gap:12px;margin-top:16px}.vc{background:#fff;border-radius:12px;padding:12px;display:grid;grid-template-columns:1fr;gap:8px}.vc audio{width:100%}
.finish{background:#eef3ea}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;margin-top:26px}.pgrid img{width:100%;box-shadow:0 10px 22px -14px rgba(0,0,0,.45);background:#fbf8f1}
.edrow{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:14px 0;border-top:1px solid #ece3d3}.edrow img{width:120px;aspect-ratio:4/3;object-fit:cover;border-radius:8px}
.edrow textarea,.edrow input{margin-top:6px}
.voicebody{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.voicecard{background:var(--paper);border-radius:22px;padding:40px 34px;text-align:center;max-width:520px;box-shadow:0 30px 60px -36px rgba(60,40,20,.55)}
.voicecard h1{font-size:clamp(28px,6vw,40px);margin:8px 0 24px}
.play{width:150px;height:150px;border-radius:50%;border:0;background:var(--green);color:#fff;font-size:56px;cursor:pointer;box-shadow:0 18px 30px -14px rgba(58,83,64,.8);margin-bottom:14px}
@media (max-width:560px){.card{padding:22px 18px}.edrow{grid-template-columns:1fr}.edrow img{width:100%}}
