body .pcv-dl-form {
--pcv-dl-navy: var(--pcv-navy, #0F1E33);
--pcv-dl-copper: var(--pcv-copper, #C88B41);
--pcv-dl-copper-deep: var(--pcv-copper-deep, #8F5A24);
--pcv-dl-cream: var(--pcv-cream, #F7F4EE);
--pcv-dl-grey: var(--pcv-grey, #5B6472);
--pcv-dl-line: var(--pcv-line, rgba(15, 30, 51, 0.12));
--pcv-dl-error: #B3261E;
position: relative;
max-width: 40rem;
margin: 0;
font-family: var(--pcv-sans, inherit);
color: var(--pcv-dl-navy);
}
body .pcv-dl-form [hidden] { display: none !important; } body .pcv-dl-form .pcv-dl-choices {
display: grid;
gap: 0.75rem;
margin: 0 0 1.75rem;
padding: 0;
border: 0;
min-width: 0;
}
body .pcv-dl-form .pcv-dl-legend,
body .pcv-dl-form .pcv-dl-label {
display: block;
margin: 0 0 0.75rem;
padding: 0;
font-family: var(--pcv-serif, Georgia, serif);
font-size: 1.0625rem;
font-weight: 700;
line-height: 1.4;
color: var(--pcv-dl-navy);
}
body .pcv-dl-form .pcv-dl-label { margin-bottom: 0.5rem; } body .pcv-dl-form .pcv-dl-legend {
margin-bottom: 1rem;
font-size: clamp(1.375rem, 1.2rem + 0.5vw, 1.625rem);
line-height: 1.25;
}
body .pcv-dl-form .pcv-dl-choice {
display: flex;
align-items: center;
gap: 1rem;
margin: 0;
padding: 1rem 1.25rem;
background: #fff;
border: 1px solid var(--pcv-dl-line);
border-top: 3px solid var(--pcv-dl-navy);
border-radius: 0;
cursor: pointer;
transition: border-color 0.2s ease;
}
body .pcv-dl-form .pcv-dl-choice:hover { border-top-color: var(--pcv-dl-copper); }
body .pcv-dl-form .pcv-dl-choice.is-checked,
body .pcv-dl-form .pcv-dl-choice:has(input:checked) {
border-color: var(--pcv-dl-navy);
border-top-color: var(--pcv-dl-copper);
box-shadow: inset 0 0 0 1px var(--pcv-dl-navy);
}
body .pcv-dl-form .pcv-dl-icon {
flex: 0 0 auto;
display: inline-flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
width: 2.75rem;
height: 2.75rem;
border: 2px solid var(--pcv-dl-copper);
border-radius: 50%;
background: var(--pcv-dl-navy);
color: var(--pcv-dl-copper);
}
body .pcv-dl-form .pcv-dl-icon svg { display: block; }
body .pcv-dl-form .pcv-dl-choice-text { flex: 1 1 auto; min-width: 0; }
body .pcv-dl-form .pcv-dl-choice-title {
display: block;
font-weight: 600;
font-size: 1rem;
line-height: 1.4;
color: var(--pcv-dl-navy);
}
body .pcv-dl-form .pcv-dl-choice-desc {
display: block;
margin-top: 0.3rem;
font-size: 0.9375rem;
font-weight: 400 !important;
line-height: 1.55;
color: var(--pcv-dl-grey);
}
body .pcv-dl-form .pcv-dl-choice-desc + .pcv-dl-choice-meta { margin-top: 0.4rem; }
body .pcv-dl-form .pcv-dl-choice-meta {
display: block;
margin-top: 0.15rem;
font-size: 0.8125rem;
letter-spacing: 0.04em;
color: var(--pcv-dl-grey);
} body .pcv-dl-form .pcv-dl-choice input[type="checkbox"] {
-webkit-appearance: none;
appearance: none;
flex: 0 0 auto;
box-sizing: border-box;
width: 1.375rem;
height: 1.375rem;
margin: 0;
border: 2px solid var(--pcv-dl-navy);
border-radius: 0;
background: #fff center / 0.875rem no-repeat;
cursor: pointer;
position: static;
opacity: 1;
transition: background-color 0.2s ease;
}
body .pcv-dl-form .pcv-dl-choice input[type="checkbox"]:checked {
background-color: var(--pcv-dl-navy);
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23C88B41' stroke-width='2.4' stroke-linecap='square' d='M3 8.5l3.2 3L13 4.5'/%3E%3C/svg%3E");
}
body .pcv-dl-form .pcv-dl-choice input[type="checkbox"]:focus-visible {
outline: 2px solid var(--pcv-dl-copper);
outline-offset: 3px;
} body .pcv-dl-form .pcv-dl-field { margin: 0 0 1.5rem; }
body .pcv-dl-form input.pcv-dl-input[type="email"] {
display: block;
box-sizing: border-box;
width: 100%;
height: auto;
margin: 0;
padding: 0.85rem 1rem;
font-family: inherit;
font-size: 1rem;
line-height: 1.4;
color: var(--pcv-dl-navy);
background: #fff;
border: 1px solid rgba(15, 30, 51, 0.35);
border-radius: 0;
box-shadow: none;
transition: border-color 0.2s ease;
}
body .pcv-dl-form input.pcv-dl-input[type="email"]:focus {
border-color: var(--pcv-dl-navy);
outline: 2px solid var(--pcv-dl-copper);
outline-offset: 2px;
}
body .pcv-dl-form input.pcv-dl-input[aria-invalid="true"] { border-color: var(--pcv-dl-error); } body .pcv-dl-form .pcv-dl-submit,
body .pcv-dl-form .pcv-dl-again {
display: inline-block;
margin: 0;
padding: 0.95rem 1.6rem;
font-family: inherit;
font-size: 0.9375rem;
font-weight: 600;
letter-spacing: 0.02em;
line-height: 1.2;
color: #fff;
background: var(--pcv-dl-navy);
border: 0;
border-bottom: 3px solid var(--pcv-dl-copper);
border-radius: 0;
cursor: pointer;
transition: background-color 0.2s ease;
}
body .pcv-dl-form .pcv-dl-submit:hover,
body .pcv-dl-form .pcv-dl-again:hover { background: var(--pcv-dl-copper-deep); }
body .pcv-dl-form .pcv-dl-submit:focus-visible,
body .pcv-dl-form .pcv-dl-again:focus-visible {
outline: 2px solid var(--pcv-dl-copper);
outline-offset: 3px;
}
body .pcv-dl-form .pcv-dl-submit[disabled] { cursor: progress; opacity: 0.8; } body .pcv-dl-form .pcv-dl-error {
margin: 0.5rem 0 0;
padding: 0;
font-size: 0.875rem;
line-height: 1.45;
color: var(--pcv-dl-error);
}
body .pcv-dl-form .pcv-dl-status {
margin: 1rem 0 0;
font-size: 0.9375rem;
line-height: 1.5;
}
body .pcv-dl-form .pcv-dl-status.is-error {
padding: 0.75rem 1rem;
color: var(--pcv-dl-error);
background: #FBEFEE;
border-left: 3px solid var(--pcv-dl-error);
}
body .pcv-dl-form .pcv-dl-privacy {
margin: 1rem 0 0;
font-size: 0.8125rem;
line-height: 1.5;
color: var(--pcv-dl-grey);
}
body .pcv-dl-form .pcv-dl-privacy a { color: var(--pcv-dl-copper-deep); text-decoration: underline; }
body .pcv-dl-form .pcv-dl-success {
padding: 1.5rem 1.5rem 1.6rem;
background: var(--pcv-dl-cream);
border-top: 3px solid var(--pcv-dl-copper);
outline: none;
}
body .pcv-dl-form .pcv-dl-success-text {
margin: 0 0 1.25rem;
font-size: 1rem;
line-height: 1.6;
color: var(--pcv-dl-navy);
} body .pcv-dl-form .pcv-dl-hp {
position: absolute !important;
left: -10000px !important;
top: auto !important;
width: 1px !important;
height: 1px !important;
overflow: hidden !important;
}
@media (max-width: 480px) {
body .pcv-dl-form .pcv-dl-choice { padding: 0.9rem 1rem; gap: 0.8rem; }
body .pcv-dl-form .pcv-dl-icon { width: 2.4rem; height: 2.4rem; }
body .pcv-dl-form .pcv-dl-submit { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
body .pcv-dl-form * { transition: none !important; }
}