:root{
color-scheme:light;
--pa-ink:#173b49;
--pa-muted:#627580;
--pa-line:#dce5e8;
--pa-accent:#c2944c;
--pa-green:#376f61}
*{
box-sizing:border-box}
.portal-access-page{
margin:0;
min-height:100vh;
min-height:100svh;
display:flex;
flex-direction:column;
background:#f5f5f0;
color:var(--pa-ink);
font-family:Inter,"Segoe UI",Arial,sans-serif;
-webkit-font-smoothing:antialiased}
a{
color:inherit}
button,input{
font:inherit}
button,a,input{
touch-action:manipulation}
button{
cursor:pointer}
a:focus-visible,button:focus-visible,input:focus-visible{
outline:3px solid #be9859;
outline-offset:4px}
.pa-header{
width:100%;
max-width:1152px;
margin:auto;
margin-top:0;
margin-bottom:0;
padding:22px 32px;
display:flex;
align-items:center;
justify-content:space-between;
gap:20px}
.pa-brand{
display:flex;
align-items:center;
gap:23px;
text-decoration:none}
.pa-brand img{
width:144px;
height:48px;
object-fit:contain;
object-position:left center}
.pa-brand>span{
border-left:1px solid #d6deda;
padding-left:23px;
color:var(--pa-muted);
font-size:13px;
max-width:230px}
.pa-help{
font-size:13px;
text-decoration:none;
white-space:nowrap}
.pa-help span{
padding-left:7px;
color:var(--pa-green)}
.pa-main{
width:100%;
max-width:1088px;
margin:18px auto 30px;
padding:0 32px;
display:grid;
grid-template-columns:minmax(0,1fr) 444px;
gap:52px;
align-items:start}
.pa-eyebrow{
font-size:11px;
font-weight:700;
letter-spacing:1.3px;
text-transform:uppercase;
color:var(--pa-green)}
.pa-dot{
display:inline-block;
width:6px;
height:6px;
border-radius:50%;
background:var(--pa-green);
margin-right:7px;
vertical-align:middle}
.pa-story{
padding:22px 0}
.pa-story h1{
margin:16px 0 14px;
font-size:38px;
line-height:1.18;
letter-spacing:-1.3px;
font-weight:600}
.pa-story>p{
color:var(--pa-muted);
font-size:15px;
line-height:1.75;
max-width:410px}
.pa-story-card{
margin-top:24px;
display:flex;
gap:16px;
align-items:flex-start}
.pa-story-card svg{
width:34px;
height:34px;
flex:0 0 34px;
color:var(--pa-green)}
.pa-story-card strong{
display:block;
font-size:14px;
margin-bottom:7px}
.pa-story-card span{
font-size:12px;
color:var(--pa-muted);
line-height:1.8}
.pa-card{
background:#fff;
border:1px solid #e0e6e3;
border-radius:23px;
padding:28px 30px 22px;
box-shadow:0 18px 55px #2545370a;
min-width:0}
.pa-card-top{
display:flex;
align-items:center;
justify-content:space-between;
gap:10px}
.pa-card-top>.pa-eyebrow{
max-width:240px;
overflow-wrap:anywhere}
.pa-step{
font-size:10px;
border:1px solid var(--pa-line);
border-radius:20px;
padding:6px 10px;
color:var(--pa-muted)}
.pa-card-title{
margin:22px 0}
.pa-card-title h2{
font-size:25px;
font-weight:600;
line-height:1.23;
letter-spacing:-.8px;
margin:0 0 10px}
.pa-card-title h2:focus{
outline:none}
.pa-card-title p,.pa-body-copy{
font-size:14px;
line-height:1.8;
color:var(--pa-muted);
margin:0}
.pa-form{
display:flex;
flex-direction:column;
gap:12px}
.pa-form>label:not(.pa-check){
font-size:12px;
font-weight:650;
margin-top:6px}
.pa-form>input:not([type=hidden]){
width:100%;
min-width:0;
border:1px solid #cfdbdf;
border-radius:10px;
background:#fff;
color:var(--pa-ink);
height:51px;
padding:12px 14px;
transition:border-color .15s}
.pa-form>input:hover{
border-color:#91aaa3}
.pa-form>input:focus{
outline:3px solid #edf2ee;
outline-offset:1px;
border-color:var(--pa-green)}
.pa-form input::placeholder{
color:#a0acb1}
.pa-button{
display:flex;
align-items:center;
justify-content:center;
gap:12px;
width:100%;
min-height:50px;
background:var(--pa-ink);
border:1px solid var(--pa-ink);
border-radius:10px;
color:white;
font-size:13px;
font-weight:650;
text-decoration:none;
padding:13px 15px;
line-height:1.5;
margin-top:8px;
transition:background .15s}
.pa-button span{
margin-left:auto;
font-size:20px;
font-weight:400}
.pa-button:hover{
background:#245363}
.pa-button:disabled{
opacity:.65;
cursor:wait}
.pa-button-secondary{
background:white;
color:var(--pa-ink);
border-color:var(--pa-line);
margin-top:0}
.pa-button-secondary:hover{
background:#f3f7f5}
.pa-hint{
font-size:11px!important;
line-height:1.75!important;
color:var(--pa-muted);
margin:3px 0 0}
.pa-bottom-note{
margin-top:28px;
display:flex;
gap:11px;
align-items:flex-start;
padding:18px 0 0;
border-top:1px solid #edf0ef}
.pa-bottom-note>span{
font-size:19px;
color:#8d9e9a}
.pa-bottom-note p{
margin:0;
font-size:11px;
line-height:1.8;
color:var(--pa-muted)}
.pa-card-foot{
display:flex;
align-items:center;
gap:7px;
border-top:1px solid #edf0ef;
padding-top:20px;
margin-top:27px;
font-size:10px;
line-height:1.6;
color:#81918f}
.pa-card-foot svg{
width:17px;
height:17px;
flex-shrink:0}
.pa-feedback{
padding:13px 15px;
border-radius:9px;
background:#eef3f5;
color:#385866;
font-size:12px;
line-height:1.7;
margin-bottom:20px;
overflow-wrap:anywhere}
.pa-error{
background:#fff1ee;
color:#8c3a2d;
border:1px solid #f1d6ce}
.pa-success{
background:#edf5ef;
color:#386551}
.pa-email-tag{
padding:12px 14px;
background:#f2f6f4;
border-radius:9px;
font-size:12px;
overflow-wrap:anywhere;
display:flex;
gap:10px;
align-items:center;
margin:0 0 18px}
.pa-verified{
margin-left:auto;
color:var(--pa-green);
font-size:10px;
white-space:nowrap}
.pa-form input.pa-code{
font-family:Consolas,Menlo,monospace;
letter-spacing:12px;
text-align:center;
font-size:28px;
height:65px;
padding-left:25px}
.pa-check{
display:flex;
align-items:flex-start;
gap:11px;
font-size:12px;
line-height:1.65;
font-weight:500;
margin:9px 0}
.pa-check input{
margin:3px 0 0;
width:17px;
height:17px;
flex-shrink:0;
accent-color:var(--pa-green)}
.pa-check small{
display:block;
color:var(--pa-muted);
font-size:10px;
line-height:1.7;
margin-top:5px;
font-weight:400}
.pa-code-actions{
display:flex;
gap:20px;
align-items:flex-start;
justify-content:space-between;
margin-top:19px;
font-size:11px}
.pa-code-actions form{
max-width:60%}
.pa-code-actions a{
text-decoration:none;
line-height:1.6}
.pa-text-button{
padding:0;
border:0;
background:transparent;
color:var(--pa-green);
font-size:11px;
line-height:1.6;
text-align:left}
.pa-text-button:disabled{
color:#81938c;
cursor:default}
.pa-choice{
display:flex;
gap:13px;
align-items:center;
text-align:left;
background:white;
padding:18px 13px;
border:1px solid var(--pa-line);
border-radius:12px;
color:var(--pa-ink);
line-height:1.5}
.pa-choice:hover{
border-color:var(--pa-green);
background:#f6f9f6}
.pa-choice>span:last-child{
margin-left:auto}
.pa-choice strong{
display:block;
font-size:12px}
.pa-choice small{
display:block;
margin-top:5px;
color:var(--pa-muted);
font-size:10px}
.pa-choice-icon{
color:var(--pa-green);
font-size:22px}
.pa-back{
display:block;
margin-top:20px;
text-decoration:none;
font-size:11px;
color:var(--pa-green);
line-height:1.7}
.pa-waiting-icon{
width:57px;
height:57px;
border-radius:50%;
display:grid;
place-items:center;
color:var(--pa-green);
background:#eaf2ed;
font-size:25px;
margin-bottom:20px}
.pa-footer{
width:100%;
max-width:1088px;
margin:auto auto 0;
padding:0 32px 22px;
display:flex;
justify-content:space-between;
gap:20px;
font-size:10px;
color:#87928c;
line-height:1.7}
.pa-footer>span:first-child>span{
padding:0 6px}
.form-captcha{
margin:2px 0;
font-size:11px;
max-width:100%;
overflow:hidden}
.form-captcha small{
font-size:10px;
color:var(--pa-muted)}
.form-captcha [hidden]{
display:none!important}
.pa-recovery-table{
width:100%;
border-collapse:collapse}
.pa-recovery-table td,.pa-recovery-table th{
padding:12px;
text-align:left;
border-bottom:1px solid #dce5e8}
.pa-review-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px}
.pa-review-card{
padding:23px;
border:1px solid #dce5e8;
border-radius:14px}
.pa-review-card label{
display:block;
margin:12px 0}
.pa-review-card select,.pa-review-card textarea{
width:100%;
padding:10px}
.pa-review-card p{
overflow-wrap:anywhere}
@media(max-width:1000px){
.pa-main{
gap:35px;
grid-template-columns:minmax(220px,1fr) minmax(350px,440px)}
.pa-story h1{
font-size:33px}
.pa-card{
padding:26px}
}
@media(max-width:760px){
.pa-header{
padding:14px 20px}
.pa-brand{
gap:12px}
.pa-brand>span{
padding-left:12px;
font-size:11px;
max-width:125px}
.pa-brand img{
width:108px;
height:36px}
.pa-help{
font-size:12px}
.pa-main{
display:block;
padding:0 18px;
margin:4px auto 22px;
max-width:480px}
.pa-story{
padding:0 2px 16px}
.pa-story>.pa-eyebrow{
display:none}
.pa-story h1{
font-size:24px;
letter-spacing:-.7px;
line-height:1.2;
margin:0 0 8px}
.pa-story h1 br{
display:none}
.pa-story>p{
font-size:12.5px;
line-height:1.6;
margin:0;
max-width:100%}
.pa-story-card{
display:none}
.pa-card{
padding:22px 22px 18px;
border-radius:18px}
.pa-card-top>.pa-eyebrow{
font-size:10px}
.pa-step{
padding:4px 8px}
.pa-card-title{
margin:16px 0}
.pa-card-title h2{
font-size:22px;
letter-spacing:-.6px}
.pa-card-title p{
font-size:12.5px;
line-height:1.6}
.pa-form{
gap:10px}
.pa-form>label:not(.pa-check){
margin-top:0}
.pa-form>input:not([type=hidden]){
font-size:16px;
height:50px}
.pa-form input.pa-code{
font-size:28px;
height:60px}
.pa-button{
min-height:48px;
margin-top:4px;
padding:11px 14px}
.pa-bottom-note{
margin-top:18px;
padding-top:14px}
.pa-card-foot{
margin-top:16px;
padding-top:14px}
.pa-footer{
padding:0 20px 16px;
font-size:9px}
.pa-review-grid{
grid-template-columns:1fr}
}
@media(max-width:380px){
.pa-header{
padding:12px 16px}
.pa-brand>span{
display:none}
.pa-main{
padding:0 14px}
.pa-card{
padding:20px 18px 16px}
.pa-card-title h2{
font-size:21px}
.pa-help{
font-size:11px}
.pa-code-actions{
gap:12px}
.pa-step{
font-size:9px;
padding:5px 7px}
}
@media(max-width:760px){
.pa-progress-page .pa-story{
display:none}
.pa-progress-page .pa-main{
margin-top:8px}
}