.volunteer-form-page{--f-teal:#a6edf0;--f-pink:#ffb2d0;--f-purple:#d8c4ff;--f-yellow:#ffe990;--f-blue:#c7ecff}
.form-hero{padding:58px 0 34px}.form-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:42px;align-items:end}.form-hero h1{margin-top:14px;font-size:clamp(3rem,6vw,5.4rem)}.form-hero .lede{margin-top:18px}.welcome-note{display:flex;gap:16px;align-items:flex-start;padding:22px;border-radius:24px;background:rgba(255,255,255,.82);border:1px solid var(--line);box-shadow:var(--soft-shadow)}.welcome-note strong{display:block;line-height:1.35}.welcome-note p{font-size:.91rem;line-height:1.65;margin-top:7px}.welcome-icon{width:42px;height:42px;border-radius:14px;flex:0 0 auto;display:grid;place-items:center;background:var(--yellow);border:1px solid rgba(40,50,58,.12);font-weight:800}
.form-section{padding:20px 0 82px}.form-shell{max-width:980px}.form-progress-wrap{padding:22px 24px;border-radius:24px 24px 0 0;background:rgba(255,255,255,.86);border:1px solid var(--line);border-bottom:0}.form-progress-head{display:flex;justify-content:space-between;gap:20px;font-size:.82rem;font-weight:750;color:var(--ink-2);margin-bottom:12px}.form-progress-track{height:9px;border-radius:999px;background:rgba(40,50,58,.08);overflow:hidden}.form-progress-fill{width:25%;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--teal),var(--pink),var(--purple));transition:width .3s ease}.progress-labels{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:11px;color:#8a949b;font-size:.72rem;font-weight:650}.progress-labels span:nth-child(2),.progress-labels span:nth-child(3){text-align:center}.progress-labels span:last-child{text-align:right}.progress-labels span.active{color:var(--ink)}
#hcVolunteerForm,.success-screen{background:rgba(255,255,255,.76);border:1px solid var(--line);border-radius:0 0 30px 30px;box-shadow:var(--soft-shadow);padding:38px}.form-step{display:none}.form-step.active{display:block;animation:fadein .28s ease}@keyframes fadein{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.step-heading{display:flex;align-items:flex-start;gap:17px;margin-bottom:30px}.step-heading h2{font-size:clamp(1.9rem,3.6vw,3rem);line-height:1.08}.step-heading p{margin-top:8px;max-width:720px}.step-chip{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;flex:0 0 auto;border:1.5px solid var(--ink);box-shadow:3px 4px 0 var(--ink);font-size:.86rem;font-weight:800}.teal-chip{background:var(--teal)}.pink-chip{background:var(--pink)}.purple-chip{background:var(--purple)}.yellow-chip{background:var(--yellow)}
.field-grid{display:grid;gap:18px}.field-grid.two{grid-template-columns:1fr 1fr}.field{display:flex;flex-direction:column;gap:8px;position:relative}.field.full{margin-top:22px}.field>span{font-size:.9rem;font-weight:700}.field b,.question-block h3 b,.confirm-row b{color:#d34e7c}.field input,.field select,.field textarea{width:100%;border:1.5px solid rgba(40,50,58,.17);background:rgba(255,255,255,.92);color:var(--ink);border-radius:16px;padding:14px 15px;outline:none;transition:.15s ease}.field input,.field select{min-height:51px}.field textarea{min-height:108px;resize:vertical;line-height:1.6}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--purple-2);box-shadow:0 0 0 4px rgba(156,125,240,.12);background:#fff}.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:#dd5f82;box-shadow:0 0 0 4px rgba(221,95,130,.1)}.char-count{align-self:flex-end;font-size:.73rem;color:#8b969e;margin-top:-3px}
.path-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.path-choice{position:relative;min-height:190px;border:2px solid rgba(40,50,58,.85);border-radius:25px;padding:24px;display:flex;flex-direction:column;align-items:flex-start;cursor:pointer;box-shadow:5px 6px 0 rgba(40,50,58,.88);transition:.18s ease}.path-choice:hover{transform:translateY(-3px)}.path-choice:has(input:checked){transform:translate(-2px,-2px);box-shadow:8px 9px 0 rgba(40,50,58,.92)}.path-choice input{position:absolute;opacity:0}.path-choice strong{font-size:1.42rem;line-height:1.12;margin-top:8px}.path-choice>span:last-child{margin-top:10px;color:#3f4a52;font-size:.91rem;line-height:1.6}.choice-kicker{font-size:.72rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.choice-check{position:absolute;right:17px;top:17px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1.5px solid rgba(40,50,58,.22);color:transparent;font-size:.85rem;font-weight:800}.path-choice:has(input:checked) .choice-check{color:var(--ink);border-color:var(--ink)}.teal-card{background:rgba(166,237,240,.76)}.pink-card{background:rgba(255,178,208,.72)}.purple-card{background:rgba(216,196,255,.75)}.yellow-card{background:rgba(255,233,144,.76)}.blue-card{background:rgba(199,236,255,.78)}.wide-choice{grid-column:1/-1;min-height:150px}
.dynamic-section{display:grid;gap:22px}.question-block{padding:24px;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.72)}.question-block h3{font-size:1.08rem;line-height:1.35;letter-spacing:-.01em}.question-help{margin-top:6px;font-size:.88rem;line-height:1.55;color:#77828a}.subcategory{padding-top:18px}.subcategory+.subcategory{margin-top:18px;border-top:1px dashed rgba(40,50,58,.16)}.subcategory-title{display:flex;align-items:center;gap:10px;margin-bottom:12px}.subcategory-title span:first-child{width:13px;height:13px;border-radius:50%;flex:0 0 auto}.subcategory-title strong{font-size:1rem}.subcategory-title small{margin-left:auto;color:#879199;font-size:.72rem;font-weight:650}
.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.check-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.check-card{position:relative;min-height:54px;display:flex;align-items:center;cursor:pointer}.check-card input{position:absolute;opacity:0}.check-card span{width:100%;min-height:54px;display:flex;align-items:center;padding:11px 13px 11px 42px;border-radius:15px;background:#fff;border:1.5px solid rgba(40,50,58,.14);font-size:.85rem;font-weight:650;line-height:1.35;transition:.16s ease}.check-card span:before{content:"";position:absolute;left:13px;top:50%;transform:translateY(-50%);width:18px;height:18px;border-radius:6px;border:1.5px solid rgba(40,50,58,.28);background:#fff}.check-card input:checked+span{border-color:var(--ink);background:rgba(216,196,255,.25)}.check-card input:checked+span:before{content:"✓";display:grid;place-items:center;color:var(--ink);background:var(--yellow);border-color:var(--ink);font-size:.72rem;font-weight:800}
.pill-options{display:flex;flex-wrap:wrap;gap:9px;margin-top:14px}.pill-options label{position:relative;cursor:pointer}.pill-options input{position:absolute;opacity:0}.pill-options span{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 13px;border-radius:999px;border:1.5px solid rgba(40,50,58,.15);background:#fff;font-size:.82rem;font-weight:650}.pill-options input:checked+span{border-color:var(--ink);background:var(--teal)}.mini-callout{padding:14px 16px;border-radius:16px;background:rgba(255,233,144,.3);border:1px solid rgba(40,50,58,.1);font-size:.87rem;color:var(--ink-2);line-height:1.55}.conditional-field{margin-top:16px}.conditional-field[hidden]{display:none!important}
.confirm-row{display:flex;gap:11px;align-items:flex-start;margin-top:26px;padding:18px;border-radius:18px;background:rgba(166,237,240,.19)}.confirm-row input{margin-top:4px;accent-color:var(--teal-2)}.confirm-row span{font-size:.88rem;line-height:1.55}.submission-note{margin-top:14px;font-size:.78rem;color:#849098}.form-errors{display:none;margin-top:18px;padding:13px 15px;border-radius:15px;background:#fff1f5;color:#9b3858;border:1px solid rgba(155,56,88,.17);font-size:.84rem;font-weight:600}.form-errors.show{display:block}.form-nav{display:flex;align-items:center;gap:12px;margin-top:32px;padding-top:24px;border-top:1px solid rgba(40,50,58,.1)}.form-nav-spacer{flex:1}
.success-screen{text-align:center;padding:70px 50px}.success-screen .kicker{justify-content:center}.success-screen h2{max-width:650px;margin:18px auto 0;font-size:clamp(2.3rem,4.6vw,4rem)}.success-screen p{max-width:650px;margin:18px auto 28px}.success-screen .btn-row{justify-content:center}
@media(max-width:820px){.form-hero-grid{grid-template-columns:1fr;gap:24px}.form-hero{padding-top:42px}#hcVolunteerForm,.success-screen{padding:28px 22px}.form-progress-wrap{padding:18px 20px}.field-grid.two{grid-template-columns:1fr}.path-choice-grid{grid-template-columns:1fr}.wide-choice{grid-column:auto}.path-choice{min-height:155px}.check-grid.three{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.form-hero{padding:34px 0 25px}.form-hero h1{font-size:clamp(2.8rem,14vw,4.2rem)}.welcome-note{padding:18px}.progress-labels{display:none}.step-heading{gap:12px}.step-chip{width:40px;height:40px;border-radius:13px}.check-grid,.check-grid.three{grid-template-columns:1fr}.question-block{padding:19px}.path-choice{padding:20px}.form-nav{flex-wrap:wrap}.form-nav .btn{flex:1 1 auto}}

/* V8 typography fix */
.volunteer-form-page input,.volunteer-form-page textarea,.volunteer-form-page select,.volunteer-form-page button,.volunteer-form-page ::placeholder{font-family:"Poppins","Avenir Next","Segoe UI",Arial,sans-serif!important;}
.volunteer-form-page textarea::placeholder,.volunteer-form-page input::placeholder{font-weight:400;letter-spacing:0;color:#899198;opacity:1;}

/* V9 form final-step and hidden-state fixes */
[hidden]{display:none!important}
.form-nav button[hidden],.form-step[hidden]{display:none!important}
.final-step-banner{display:flex;gap:12px;align-items:center;padding:16px 18px;margin:-8px 0 24px;border-radius:18px;background:linear-gradient(100deg,rgba(255,233,144,.55),rgba(255,178,208,.28));border:1px solid rgba(40,50,58,.1)}
.final-step-banner strong{white-space:nowrap}
.final-step-banner span{font-size:.84rem;line-height:1.5;color:var(--ink-2)}
.submit-reminder{margin-top:22px;padding:18px 20px;border-radius:18px;background:rgba(166,237,240,.28);border:1px solid rgba(40,50,58,.1)}
.submit-reminder p{font-size:.85rem;line-height:1.55;margin-top:4px}
input,textarea,select,button{font-family:"Poppins","Avenir Next","Segoe UI",Arial,sans-serif!important}

/* V11 live-form polish */
.submit-reminder{margin-top:20px;background:linear-gradient(105deg,rgba(166,237,240,.3),rgba(216,196,255,.24));}
.form-errors.show{margin-top:18px}
.success-screen p{max-width:670px;margin:14px auto 0;line-height:1.65}