/* Contact module — book-a-demo layout */

.contact-wrap {
    padding: 4rem 0 5rem;
    background:
        radial-gradient(600px 300px at 0% 0%, rgba(47, 76, 240, .08), transparent 70%),
        radial-gradient(500px 300px at 100% 20%, rgba(255, 185, 49, .12), transparent 70%);
}

.trial-callout {
    display: flex;
    align-items: center;
    gap: .9rem;
    margin-top: 1.5rem;
    padding: .9rem 1.1rem;
    border-radius: var(--po-radius);
    background: var(--po-navy);
    color: #fff;
    text-decoration: none;
    transition: transform .2s, box-shadow .2s;
}

.trial-callout:hover { color: #fff; transform: translateY(-2px); box-shadow: var(--po-shadow-lg); }
.trial-callout > span:nth-child(2) { flex: 1; }
.trial-callout b { display: block; }
.trial-callout small { color: rgba(255, 255, 255, .7); }
.trial-callout > .icon { color: var(--po-gold); }

.trial-callout-icon {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 12px;
    background: var(--po-gold);
    color: var(--po-navy);
}

.next-steps {
    list-style: none;
    padding: 0;
    margin: 2rem 0;
    display: grid;
    gap: 1.25rem;
}

.next-steps li { display: flex; gap: 1rem; }
.next-steps b { display: block; font-size: 1.05rem; }
.next-steps p { margin: .15rem 0 0; color: var(--po-muted); }

.next-num {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: var(--po-navy);
    color: var(--po-gold);
    font-weight: 800;
}

.contact-cards { display: grid; gap: .75rem; }

.contact-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    border-radius: var(--po-radius);
    background: #fff;
    border: 1px solid var(--po-line);
}

.contact-card .icon { color: var(--po-blue); flex: 0 0 auto; }
.contact-card small { display: block; color: var(--po-muted); font-weight: 600; }
.contact-card a, .contact-card span { font-weight: 700; color: var(--po-ink); text-decoration: none; }

.form-card {
    padding: 2rem;
    background: #fff;
    border: 1px solid var(--po-line);
    border-radius: var(--po-radius-lg);
    box-shadow: var(--po-shadow-lg);
}

/* Radio / checkbox options rendered as pills */
.pill-options { display: flex; flex-wrap: wrap; gap: .5rem; }

.pill-option {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: .5rem 1rem;
    border: 1px solid var(--po-line);
    border-radius: 999px;
    background: #fff;
    font-weight: 600;
    font-size: .925rem;
    cursor: pointer;
    user-select: none;
    transition: all .15s;
}

.pill-option .icon { display: none; }
.pill-option:hover { border-color: var(--po-blue); }

.btn-check:checked + .pill-option {
    background: var(--po-navy);
    border-color: var(--po-navy);
    color: #fff;
}

.btn-check:checked + .pill-option .icon { display: inline-block; color: var(--po-gold); }
.btn-check:focus-visible + .pill-option { box-shadow: 0 0 0 .2rem rgba(47, 76, 240, .25); }

.form-success { text-align: center; padding: 2rem 1rem; }
.form-success h2 { font-weight: 800; margin: 1rem 0 .5rem; }
.form-success p { color: var(--po-muted); }
.form-success .reference { color: var(--po-ink); }

.state-icon-lg {
    display: inline-grid;
    place-items: center;
    width: 76px;
    height: 76px;
    border-radius: 50%;
    background: var(--po-teal-50);
    color: var(--po-teal);
}