.scc-form-page {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 26rem);
    gap: clamp(2rem, 1rem + 4vw, 4rem);
    align-items: start;
    padding-block: var(--scc-section-y);
}

.scc-form-page__aside {
    position: sticky;
    top: calc(var(--scc-header-h) + 1rem);
}

.scc-form {
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
    padding: clamp(1.25rem, 1rem + 1vw, 2rem);
    background: var(--scc-surface);
    border-radius: var(--scc-radius);
}

.scc-form__field { display: flex; flex-direction: column; gap: 0.3rem; }

.scc-form__field label {
    font-size: var(--scc-text-small);
    font-weight: var(--scc-weight-bold);
    color: var(--scc-text);
}

/* (0,2,1) so hello-elementor's attribute-selector reset and the kit's bare
   input/select rules both lose: they would otherwise repaint these mid-form. */
.scc-form .scc-form__field input,
.scc-form .scc-form__field select,
.scc-form .scc-form__field textarea {
    width: 100%;
    padding: 0.65rem 0.85rem;
    background: var(--scc-bg);
    border: 1px solid var(--scc-line);
    border-radius: calc(var(--scc-radius) - 4px);
    color: var(--scc-text-strong);
    font-family: var(--scc-font);
    font-size: var(--scc-text-body);
    line-height: 1.4;
}

.scc-form .scc-form__field input:focus-visible,
.scc-form .scc-form__field select:focus-visible,
.scc-form .scc-form__field textarea:focus-visible {
    outline: 2px solid var(--scc-accent);
    outline-offset: 1px;
}

.scc-form__check {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    font-size: var(--scc-text-small);
    line-height: 1.45;
    color: var(--scc-text-muted);
}
/* Every child of the label is a flex item, so the consent text and its links live
   in one span — otherwise a link is laid out as its own column at the far right. */
.scc-form__check > span { flex: 1; }
.scc-form__check input[type="checkbox"] { flex-shrink: 0; margin-block-start: 0.15rem; }
.scc-form .scc-form__check a { color: var(--scc-accent); }

.scc-form__honeypot {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.scc-form .btn.scc-form__submit { align-self: stretch; margin-block-start: 0.4rem; }

.scc-main .scc-form__status { margin: 0; font-size: var(--scc-text-small); min-height: 1.2em; }
.scc-form__status--ok { color: #6EE7A8; }
.scc-form__status--error { color: #FCA5A5; }

@media (max-width: 900px) {
    .scc-form-page { grid-template-columns: 1fr; }
    .scc-form-page__aside { position: static; }
}

.scc-form .scc-form__file input[type="file"] {
    padding: 0.55rem;
    font-size: var(--scc-text-small);
}
.scc-main .scc-form__hint {
    margin: 0.3rem 0 0;
    font-size: var(--scc-text-small);
    color: var(--scc-text-muted);
}
