.gcc-lab-page {
    color: #334155;
}

.gcc-lab-page .gcc-eyebrow {
    display: inline-block;
    color: #3f5bd9;
    font-size: 0.875rem;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
}

.gcc-lab-page .gcc-section-title {
    margin-top: 0.75rem;
    color: #131e47;
    font-size: clamp(1.875rem, 4vw, 2.5rem);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.25;
}

.gcc-lab-page .gcc-section-copy {
    margin-top: 1rem;
    color: #64748b;
    font-size: 1rem;
    line-height: 1.75;
}

.gcc-lab-page .gcc-status {
    display: inline-flex;
    align-items: center;
    border-radius: 9999px;
    padding: 0.35rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
}

.gcc-lab-page .gcc-status-available {
    background: #ecfdf5;
    color: #047857;
}

.gcc-lab-page .gcc-status-unavailable {
    background: #fff1f2;
    color: #be123c;
}

.gcc-lab-page .gcc-question summary::-webkit-details-marker {
    display: none;
}

.gcc-lab-page .gcc-question[open] {
    border-color: #c7d2fe;
    box-shadow: 0 16px 40px rgba(19, 30, 71, 0.07);
}

.gcc-lab-page .gcc-question[open] .gcc-question-toggle {
    border-color: #3f5bd9;
    background: #3f5bd9;
    color: #fff;
}

.gcc-lab-page .gcc-question[open] .gcc-question-toggle svg {
    transform: rotate(180deg);
}

.gcc-lab-page .gcc-question-toggle,
.gcc-lab-page .gcc-question-toggle svg {
    transition: all 180ms ease;
}

.gcc-lab-page .gcc-form-label {
    display: block;
    margin-bottom: 0.45rem;
    color: #131e47;
    font-size: 0.875rem;
    font-weight: 700;
}

.gcc-lab-page .gcc-form-label > span[aria-hidden="true"] {
    color: #ef4444;
}

.gcc-lab-page .gcc-form-field {
    display: block;
    width: 100%;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    background: #fff;
    padding: 0.8rem 1rem;
    color: #1e293b;
    font-size: 0.875rem;
    line-height: 1.5;
    outline: none;
    transition: border-color 160ms ease, box-shadow 160ms ease;
}

.gcc-lab-page .gcc-form-field::placeholder {
    color: #94a3b8;
}

.gcc-lab-page .gcc-form-field:focus {
    border-color: #3f5bd9;
    box-shadow: 0 0 0 3px rgba(63, 91, 217, 0.12);
}

.gcc-lab-page .gcc-honeypot {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

@media (prefers-reduced-motion: reduce) {
    .gcc-lab-page *,
    .gcc-lab-page *::before,
    .gcc-lab-page *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

.gcc-lab-page .gcc-hero-bg,
.gcc-lab-page .gcc-hero-overlay {
    position: absolute;
    inset: 0;
    z-index: -1;
}

.gcc-lab-page .gcc-hero-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 35%;
}

.gcc-lab-page .gcc-hero-overlay {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.88) 0%, rgba(0, 0, 0, 0.75) 55%, rgba(0, 0, 0, 0.62) 100%);
}

/* Hero fills the viewport below the 80px sticky header. */
.gcc-lab-page .gcc-hero {
    display: flex;
    align-items: center;
    min-height: calc(100vh - 5rem);
    min-height: calc(100svh - 5rem);
}

.gcc-lab-page .gcc-hero > .relative {
    width: 100%;
}

.gcc-lab-page .gcc-option { cursor: pointer; }
.gcc-lab-page .gcc-question.answered .gcc-option { cursor: default; }
.gcc-lab-page .gcc-option.gcc-option-correct { background: #dcfce7; border-color: #22c55e; color: #166534; }
.gcc-lab-page .gcc-option.gcc-option-wrong { background: #fee2e2; border-color: #ef4444; color: #991b1b; }