/*
 * Glomnia — onboarding wizard (F05)
 *
 * Loaded on top of wireframe.css and built from its tokens. Only the shapes the
 * rest of the platform does not have live here: the fixed rail on the left, the
 * directory result list, the per-function offering sections, the chips that
 * behave as selection buttons.
 *
 * A separate file because the wizard has a different frame from the application:
 * no topbar, no footer, one column of decisions.
 *
 * @see docs/features/f05-onboarding.md
 * @see docs/features/f21-design-system.md
 */

/* -------------------------------------------------------------- structure */

.gl-body--wizard {
    background: var(--gl-bg);
}

.gl-wizard {
    display: grid;
    grid-template-columns: minmax(20rem, 26rem) 1fr;
    min-height: 100vh;
    min-height: 100svh;
}

.gl-wizard__rail {
    display: flex;
    flex-direction: column;
    gap: var(--gl-6);
    padding: var(--gl-6) var(--gl-6) var(--gl-5);
    color: var(--gl-on-media);
    /* Aceeași bandă bleumarin ca bara de sus, cu o urmă de auriu în colț: cine
       intră în wizard vine de pe homepage și trebuie să recunoască materialul. */
    background:
        radial-gradient(110% 70% at 85% 0%, rgba(198, 151, 73, 0.28) 0%, transparent 58%),
        radial-gradient(120% 80% at 10% 10%, rgba(28, 77, 143, 0.6) 0%, transparent 62%),
        linear-gradient(165deg, #0f2440 0%, #16355c 45%, #0a1628 100%);
    position: sticky;
    top: 0;
    height: 100vh;
    height: 100svh;
    overflow-y: auto;
}

.gl-wizard__rail .gl-brand {
    color: var(--gl-on-media);
}

.gl-wizard__eyebrow {
    font-size: 0.75rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gl-on-media-2);
    margin-bottom: var(--gl-3);
}

.gl-wizard__heading {
    font-size: clamp(1.6rem, 1.2rem + 1.4vw, 2.2rem);
    line-height: 1.12;
    letter-spacing: -0.02em;
    font-weight: 600;
    margin: 0 0 var(--gl-3);
}

.gl-wizard__lede {
    color: var(--gl-on-media-2);
    line-height: 1.6;
    font-size: 0.9375rem;
    max-width: 34ch;
}

/* ------------------------------------------------------------------ steps */

.gl-wizard__steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--gl-1);
}

.gl-wizard__step {
    display: flex;
    align-items: flex-start;
    gap: var(--gl-3);
    padding: var(--gl-2) 0;
    color: rgba(255, 255, 255, 0.5);
    position: relative;
}

/* The line joining the steps stops before the last one, so it does not dangle. */
.gl-wizard__step:not(:last-child)::before {
    content: "";
    position: absolute;
    left: 0.95rem;
    top: 2.2rem;
    bottom: -0.35rem;
    width: 1px;
    background: rgba(255, 255, 255, 0.22);
}

.gl-wizard__step-mark {
    flex: none;
    width: 1.9rem;
    height: 1.9rem;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-size: 0.8125rem;
    font-weight: 600;
    border: 1px solid rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.06);
    position: relative;
    z-index: 1;
}

.gl-wizard__step-text {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    font-size: 0.9375rem;
    line-height: 1.35;
}

.gl-wizard__step-text span {
    font-size: 0.8125rem;
    color: rgba(255, 255, 255, 0.45);
}

.gl-wizard__step.is-done {
    color: rgba(255, 255, 255, 0.78);
}

.gl-wizard__step.is-done .gl-wizard__step-mark {
    background: rgba(255, 255, 255, 0.16);
    border-color: transparent;
    color: var(--gl-on-media);
}

.gl-wizard__step.is-current {
    color: var(--gl-on-media);
}

.gl-wizard__step.is-current .gl-wizard__step-mark {
    background: var(--gl-on-media);
    color: #0b2545;
    border-color: transparent;
}

.gl-wizard__step.is-current .gl-wizard__step-text span {
    color: var(--gl-on-media-2);
}

/* ------------------------------------------------------------------ trust */

.gl-wizard__trust {
    margin-top: auto;
    padding-top: var(--gl-5);
    border-top: 1px solid rgba(255, 255, 255, 0.16);
    display: flex;
    flex-direction: column;
    gap: var(--gl-2);
}

.gl-wizard__trust-line {
    font-size: 0.8125rem;
    line-height: 1.5;
    color: var(--gl-on-media-2);
}

.gl-wizard__trust-figure {
    font-size: 0.8125rem;
    color: rgba(255, 255, 255, 0.55);
}

.gl-wizard__trust-figure strong {
    font-size: 1.05rem;
    color: var(--gl-on-media);
    margin-right: 0.35rem;
}

/* ------------------------------------------------------------------ panel */

.gl-wizard__main {
    padding: var(--gl-7) var(--gl-6) var(--gl-8);
    display: flex;
    justify-content: center;
}

.gl-wizard__panel {
    width: 100%;
    max-width: 44rem;
}

.gl-wizard__panel--concept { max-width: 82rem; }

/* ------------------------------------------------ PDF claim concept, page 1 */
.gl-claim-card { background: #fff; border: 1px solid #d9dee8; border-radius: .75rem; box-shadow: 0 .2rem .8rem rgba(15, 35, 69, .08); overflow: hidden; }
.gl-claim-card__body { padding: clamp(2rem, 4vw, 3.5rem); }
.gl-claim-card__step { color: #bd852b; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.gl-claim-card__title { margin: .85rem 0 .35rem; color: #092b63; font-size: clamp(2rem, 3.1vw, 3rem); line-height: 1.05; letter-spacing: -.035em; font-weight: 650; }
.gl-claim-card__intro { max-width: 47rem; color: #687386; line-height: 1.55; font-size: 1rem; }
.gl-claim-grid { display: grid; grid-template-columns: minmax(0, 1fr) 20rem; gap: 3rem; margin-top: 2.3rem; align-items: start; }
.gl-claim-workspace { min-width: 0; }
.gl-claim-search { min-height: 5.7rem; border: 2px solid #123b78; border-radius: .45rem; display: grid; grid-template-columns: 1.7rem 1fr; gap: 1rem; align-items: center; position: relative; padding: 1rem 1.25rem; cursor: text; box-shadow: 0 0 0 3px rgba(20, 61, 118, .04); }
.gl-claim-search > .gl-icon { width: 1.55rem; height: 1.55rem; color: #111827; }
.gl-claim-search > span { display: grid; gap: .3rem; pointer-events: none; }
.gl-claim-search__example { color: #9aa2af; font-size: .84rem; }
.gl-claim-search input { width: 100%; border: 0; outline: 0; padding: 0; background: transparent; color: #0d2f64; font: inherit; font-size: 1rem; cursor: text; }
.gl-claim-search input::placeholder { color: #687386; opacity: 1; }
.gl-claim-search:focus-within { outline: 3px solid rgba(27, 91, 172, .16); }
.gl-claim-search-hint { color: #7b8494; font-size: .85rem; margin-top: .75rem; }
.gl-claim-results__heading { display: flex; align-items: baseline; gap: .8rem; margin: 1.5rem 0 .8rem; color: #14213d; }
.gl-claim-results__heading strong { font-size: 1rem; }
.gl-claim-results__heading span { color: #8a93a3; font-size: .85rem; }
.gl-claim-results { display: grid; gap: .65rem; max-height: 19.5rem; overflow-y: auto; padding-right: .2rem; scrollbar-color: #b8c3d2 transparent; }
.gl-claim-result { min-height: 6rem; display: grid; grid-template-columns: 1.7rem 3.7rem minmax(0, 1fr) auto; align-items: center; gap: 1rem; border: 1px solid #dce1e9; border-radius: .5rem; padding: .8rem 1rem; background: #fff; transition: border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.gl-claim-result.is-selected { border: 2px solid #2a65b0; background: #f6faff; box-shadow: 0 0 0 2px rgba(42, 101, 176, .06); }
.gl-claim-result__radio { width: 1.35rem; height: 1.35rem; border: 2px solid #8f98a6; border-radius: 50%; background: #fff; position: relative; padding: 0; cursor: pointer; }
.gl-claim-result.is-selected .gl-claim-result__radio { border-color: #2867b4; }
.gl-claim-result.is-selected .gl-claim-result__radio::after { content: ''; position: absolute; inset: .22rem; border-radius: 50%; background: #2867b4; }
.gl-claim-result__logo { width: 3.7rem; height: 3.7rem; border: 1px solid #e1e5eb; border-radius: .4rem; display: grid; place-items: center; color: #204f91; background: #fff; }
.gl-claim-result__logo .gl-icon { width: 2rem; height: 2rem; }
.gl-claim-result__content { min-width: 0; display: grid; gap: .45rem; }
.gl-claim-result__content > strong { color: #102f62; font-size: 1rem; }
.gl-claim-result__meta { display: flex; align-items: center; flex-wrap: wrap; gap: .55rem; color: #7a8493; font-size: .78rem; }
.gl-claim-result__meta span { display: inline-flex; align-items: center; gap: .3rem; }
.gl-claim-result__meta .gl-icon { width: 1rem; height: 1rem; }
.gl-claim-result__meta i { width: 1px; height: .85rem; background: #c9ced7; }
.gl-claim-result__badge { display: inline-flex; align-items: center; gap: .35rem; border: 1px solid #cfe0f5; border-radius: .35rem; padding: .45rem .65rem; color: #3870b4; background: #f5f9fe; white-space: nowrap; font-size: .78rem; }
.gl-claim-result__badge .gl-icon { width: 1rem; height: 1rem; }
.gl-claim-result__access { border: 1px solid #cbd3df; border-radius: .35rem; background: #fff; color: #14345f; padding: .55rem .75rem; cursor: pointer; }
.gl-claim-suggest { width: 100%; display: flex; align-items: center; gap: 1rem; margin-top: 1.2rem; padding: 1rem 1.3rem; border: 1px solid #dce1e9; border-radius: .45rem; background: #fff; text-align: left; cursor: pointer; }
.gl-claim-suggest__icon { color: #133e79; }
.gl-claim-suggest__icon .gl-icon { width: 2.2rem; height: 2.2rem; }
.gl-claim-suggest > span:last-child { display: grid; gap: .25rem; }
.gl-claim-suggest strong { color: #17233b; }
.gl-claim-suggest small { color: #2868b4; display: inline-flex; align-items: center; gap: .3rem; }
.gl-claim-suggest small .gl-icon { width: .85rem; height: .85rem; }
.gl-claim-benefits { border: 1px solid #dce1e9; border-radius: .5rem; padding: 1.7rem; }
.gl-claim-benefits__mark { width: 2.7rem; height: 2.7rem; border-radius: 50%; display: grid; place-items: center; color: #bc842b; background: #fff7e8; }
.gl-claim-benefits__mark .gl-icon { width: 1.4rem; height: 1.4rem; }
.gl-claim-benefits h2 { color: #0d2e61; font-size: 1.15rem; margin: 1.2rem 0 1.7rem; }
.gl-claim-benefit { display: grid; grid-template-columns: 1.7rem 1fr; gap: 1rem; margin-bottom: 1.7rem; color: #153b76; }
.gl-claim-benefit > .gl-icon { width: 1.7rem; height: 1.7rem; }
.gl-claim-benefit span { display: grid; gap: .35rem; }
.gl-claim-benefit strong { color: #17233b; font-size: .9rem; }
.gl-claim-benefit small { color: #7b8492; line-height: 1.45; font-size: .8rem; }
.gl-claim-create { border-top: 1px solid #e1e5eb; margin-top: 2rem; padding-top: 2rem; }
.gl-claim-card__footer { min-height: 6rem; border-top: 1px solid #dce1e9; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem clamp(2rem, 4vw, 3.5rem); }
.gl-claim-back { display: inline-flex; align-items: center; gap: .55rem; color: #344054; text-decoration: none; font-weight: 600; }
.gl-claim-continue { min-width: 10.5rem; justify-content: center; }
.gl-claim-continue .gl-icon, .gl-claim-card__footer .gl-btn .gl-icon { width: 1.15rem; height: 1.15rem; }

@media (max-width: 78rem) { .gl-claim-grid { grid-template-columns: 1fr; gap: 1.5rem; } .gl-claim-benefits { display: none; } }
@media (max-width: 46rem) { .gl-claim-card__body { padding: 1.4rem; } .gl-claim-card__footer { padding: 1rem 1.4rem; } .gl-claim-result { grid-template-columns: 1.5rem 3.2rem 1fr; } .gl-claim-result__badge, .gl-claim-result__access { grid-column: 2 / -1; justify-self: start; } .gl-claim-search__example { display: none; } }

/* --------------------------------------------- PDF concept: steps 2 through 4 */
.gl-concept-card { background: #fff; border: 1px solid #d9dee8; border-radius: .75rem; box-shadow: 0 .2rem .8rem rgba(15, 35, 69, .08); overflow: hidden; }
.gl-concept-card__body { padding: clamp(2rem, 4vw, 3.5rem); }
.gl-concept-card__step { color: #bd852b; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.gl-concept-card__title { margin: .85rem 0 .45rem; color: #092b63; font-size: clamp(2rem, 3.1vw, 3rem); line-height: 1.05; letter-spacing: -.035em; font-weight: 650; }
.gl-concept-card__intro { max-width: 48rem; color: #687386; line-height: 1.55; font-size: 1rem; }
.gl-concept-card__footer { min-height: 6rem; border-top: 1px solid #dce1e9; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem clamp(2rem, 4vw, 3.5rem); }
.gl-concept-submit { min-width: 13rem; justify-content: center; }
.gl-concept-submit .gl-icon { width: 1.15rem; height: 1.15rem; }
.gl-concept-form-grid { display: grid; grid-template-columns: minmax(0, 1fr) 21rem; gap: 3rem; align-items: start; margin-top: 2rem; }
.gl-concept-aside-card { border: 1px solid #dce1e9; border-radius: .5rem; padding: 1.7rem; }
.gl-concept-aside-card > h2 { color: #17233b; font-size: 1.05rem; margin: 0 0 1.3rem; }
.gl-concept-aside-card hr { border: 0; border-top: 1px solid #e0e4ea; margin: 1.7rem 0; }

/* verify */
.gl-verify-form { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.2rem; }
.gl-concept-field { display: grid; gap: .4rem; color: #17233b; font-size: .88rem; font-weight: 600; }
.gl-concept-field--full { grid-column: 1 / -1; }
.gl-concept-field > span:first-child b, .gl-confirm-row > span:first-child b { color: #bd852b; }
.gl-concept-field > span:first-child em, .gl-confirm-row > span:first-child em { color: #6f7887; font-style: normal; font-weight: 400; }
.gl-concept-input { height: 3.4rem; border: 1px solid #cfd6e0; border-radius: .35rem; display: flex; align-items: center; gap: .7rem; padding: 0 1rem; background: #fff; }
.gl-concept-input:focus-within { border-color: #1f5ca8; box-shadow: 0 0 0 3px rgba(31, 92, 168, .1); }
.gl-concept-input .gl-icon { width: 1.2rem; height: 1.2rem; color: #586375; }
.gl-concept-input input { width: 100%; border: 0; outline: 0; padding: 0; background: transparent; color: #17233b; font: inherit; font-weight: 400; }
.gl-concept-input input::placeholder { color: #9ba3b1; }
.gl-verify-methods { grid-column: 1 / -1; border: 0; padding: 0; margin: .3rem 0 0; display: grid; gap: .7rem; }
.gl-verify-methods legend { color: #17233b; font-weight: 600; font-size: .9rem; margin-bottom: .75rem; }
.gl-verify-method { display: grid; grid-template-columns: 1.4rem 3.4rem 1fr; gap: 1rem; align-items: center; border: 1px solid #d6dce5; border-radius: .4rem; padding: .85rem 1rem; cursor: pointer; }
.gl-verify-method:has(input:checked) { border: 2px solid #3474c4; background: #f6f9fe; padding: calc(.85rem - 1px) calc(1rem - 1px); }
.gl-verify-method > input { position: absolute; opacity: 0; pointer-events: none; }
.gl-verify-method__radio { width: 1.3rem; height: 1.3rem; border: 2px solid #9aa3b0; border-radius: 50%; position: relative; }
.gl-verify-method:has(input:checked) .gl-verify-method__radio { border-color: #2c6fbd; }
.gl-verify-method:has(input:checked) .gl-verify-method__radio::after { content: ''; position: absolute; inset: .22rem; border-radius: 50%; background: #2c6fbd; }
.gl-verify-method__icon { width: 3.4rem; height: 3.4rem; border: 1px solid #dfe5ed; border-radius: .45rem; display: grid; place-items: center; color: #225ca7; background: #fff; }
.gl-verify-method__icon .gl-icon { width: 1.7rem; height: 1.7rem; }
.gl-verify-method > span:last-child { display: grid; gap: .3rem; }
.gl-verify-method strong { color: #102f62; font-size: .95rem; }
.gl-verify-method small { color: #77808f; font-size: .8rem; font-weight: 400; }
.gl-verify-tip { grid-column: 1 / -1; display: flex; align-items: center; gap: .8rem; border: 1px solid #dce1e9; border-radius: .35rem; padding: .7rem 1rem; color: #758091; font-size: .8rem; }
.gl-verify-tip span { width: 2rem; height: 2rem; border-radius: 50%; display: grid; place-items: center; color: #3475c4; background: #eff6ff; }
.gl-verify-tip .gl-icon { width: 1.15rem; height: 1.15rem; }
.gl-selected-company { display: grid; grid-template-columns: 3.5rem 1fr; gap: 1rem; align-items: start; }
.gl-selected-company > span { width: 3.5rem; height: 3.5rem; border: 1px solid #dce1e9; border-radius: .4rem; display: grid; place-items: center; color: #173e78; }
.gl-selected-company > span .gl-icon { width: 1.8rem; height: 1.8rem; }
.gl-selected-company > div { min-width: 0; display: grid; gap: .5rem; }
.gl-selected-company strong { color: #17233b; font-size: .95rem; }
.gl-selected-company p, .gl-selected-company a { display: flex; align-items: center; flex-wrap: wrap; gap: .4rem; color: #737d8d; font-size: .75rem; text-decoration: none; }
.gl-selected-company a { color: #2867b4; }
.gl-selected-company .gl-icon { width: .95rem; height: .95rem; }
.gl-selected-company i { width: 1px; height: .8rem; background: #c9ced6; }
.gl-concept-aside-card > .gl-claim-result__badge { margin-top: 1rem; }
.gl-aside-process { display: grid; grid-template-columns: 2.7rem 1fr; gap: .8rem; margin: 1.1rem 0; align-items: start; }
.gl-aside-process > span { width: 2.7rem; height: 2.7rem; border-radius: 50%; display: grid; place-items: center; color: #bd852b; background: #fff8eb; }
.gl-aside-process > span .gl-icon { width: 1.35rem; height: 1.35rem; }
.gl-aside-process p { display: grid; gap: .3rem; }
.gl-aside-process strong { color: #17233b; font-size: .85rem; }
.gl-aside-process small { color: #798291; font-size: .76rem; line-height: 1.45; }
.gl-verify-status { min-height: 20rem; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px solid #dce1e9; border-radius: .5rem; padding: 2rem; text-align: center; }
.gl-verify-status__icon { width: 4rem; height: 4rem; border-radius: 50%; display: grid; place-items: center; color: #2367b5; background: #eef5ff; }
.gl-verify-status__icon .gl-icon { width: 2rem; height: 2rem; }
.gl-verify-status h2 { color: #102f62; margin: 1rem 0 .5rem; }
.gl-verify-status p { color: #737d8d; max-width: 34rem; }

/* confirm */
.gl-confirm-grid { grid-template-columns: minmax(0, 1fr) 20rem; }
.gl-confirm-form { border: 1px solid #dce1e9; border-radius: .5rem; padding: 1.7rem; display: grid; gap: .8rem; }
.gl-confirm-form > h2 { color: #102f62; font-size: 1.05rem; margin-bottom: .3rem; }
.gl-confirm-form > hr { border: 0; border-top: 1px solid #dfe4eb; width: 100%; margin: .4rem 0; }
.gl-confirm-row { display: grid; grid-template-columns: 13.5rem minmax(0, 1fr) 1.6rem; gap: .8rem; align-items: center; color: #4b5667; font-size: .85rem; }
.gl-confirm-row input, .gl-confirm-row select { width: 100%; height: 2.7rem; border: 1px solid #cfd6e0; border-radius: .3rem; padding: 0 .8rem; background: #fff; color: #394456; }
.gl-confirm-row input:focus, .gl-confirm-row select:focus, .gl-confirm-description textarea:focus { outline: 2px solid rgba(39, 101, 178, .14); border-color: #2867b4; }
.gl-confirm-row > i { width: 1.35rem; height: 1.35rem; border: 2px solid #30c98b; border-radius: 50%; display: none; place-items: center; color: #30c98b; }
.gl-confirm-row > i.is-valid { display: grid; }
.gl-confirm-row > i .gl-icon { width: .75rem; height: .75rem; stroke-width: 2.4; }
.gl-confirm-row > .gl-field__error { grid-column: 2 / -1; }
.gl-confirm-locked { display: flex; position: relative; }
.gl-confirm-locked input { color: #8992a0; background: #f5f6f8; padding-right: 6rem; }
.gl-confirm-locked em { position: absolute; right: .7rem; top: 50%; transform: translateY(-50%); display: flex; align-items: center; gap: .3rem; color: #8992a0; font-size: .75rem; font-style: normal; }
.gl-confirm-locked .gl-icon { width: .9rem; height: .9rem; }
.gl-confirm-description { display: grid; grid-template-columns: 13.5rem minmax(0, 1fr); gap: .8rem; align-items: start; color: #4b5667; font-size: .85rem; }
.gl-confirm-description > div { display: grid; grid-template-columns: 3.2rem 1fr; border: 1px solid #cfd6e0; border-radius: .3rem; overflow: hidden; }
.gl-confirm-description select { border: 0; border-right: 1px solid #dce1e8; background: #f8f9fb; text-align: center; }
.gl-confirm-description textarea { border: 0; outline: 0; resize: vertical; padding: .7rem; font: inherit; color: #394456; }
.gl-confirm-description > small { grid-column: 2; display: flex; justify-content: space-between; color: #9199a6; font-size: .72rem; }
.gl-confirm-description > small em { font-style: normal; }
.gl-confirm-aside > .gl-claim-benefits__mark { margin-bottom: 1rem; }

/* activities */
.gl-activities-title-row { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.gl-activities-count { flex: none; display: inline-flex; align-items: center; gap: .5rem; border: 1px solid #dce1e9; border-radius: 2rem; padding: .55rem 1rem; color: #344054; font-size: .85rem; }
.gl-activities-count .gl-icon { width: 1.2rem; height: 1.2rem; color: #bd852b; }
.gl-activities-concept-grid { display: grid; grid-template-columns: minmax(0, 1fr) 18.5rem; gap: 3rem; align-items: start; margin-top: 2.3rem; }
.gl-activities-columns { columns: 2; column-gap: 1rem; }
.gl-activity-markets-section { margin-top: .5rem; padding-top: 1.25rem; border-top: 1px solid #dce1e9; }
.gl-activity-markets-section .gl-activity-category { display: block; margin-bottom: 0; }
.gl-activity-category--markets summary { min-height: 5.2rem; }
.gl-activity-category--markets .gl-activity-category__icon { background: #eef5ff; color: #2867b4; }
.gl-activity-category { display: inline-block; width: 100%; break-inside: avoid; border: 1px solid #dce1e9; border-radius: .45rem; background: #fff; margin: 0 0 1rem; overflow: hidden; }
.gl-activity-category[open], .gl-activity-category.is-selected { border-color: #78a6db; background: #f7faff; }
.gl-activity-category summary { min-height: 4.7rem; display: grid; grid-template-columns: 1.3rem 3rem minmax(0, 1fr) 1.2rem; gap: .8rem; align-items: center; padding: .7rem 1rem; cursor: pointer; list-style: none; }
.gl-activity-category summary::-webkit-details-marker { display: none; }
.gl-activity-category__check input { position: absolute; opacity: 0; }
.gl-activity-category__check > span { display: block; width: 1.15rem; height: 1.15rem; border: 2px solid #a1a9b4; border-radius: .18rem; background: #fff; position: relative; }
.gl-activity-category__check:has(input:checked) > span { border-color: #2867b4; background: #2867b4; }
.gl-activity-category__check:has(input:checked) > span::after { content: ''; position: absolute; left: .25rem; top: .08rem; width: .35rem; height: .6rem; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.gl-activity-category__icon { width: 3rem; height: 3rem; border-radius: 50%; display: grid; place-items: center; color: #173e78; background: #f4f6f9; }
.gl-activity-category__icon .gl-icon { width: 1.45rem; height: 1.45rem; }
.gl-activity-category summary strong { color: #102f62; font-size: .95rem; }
.gl-activity-category__chevron { width: 1.1rem; height: 1.1rem; color: #102f62; transition: transform .18s ease; }
.gl-activity-category[open] .gl-activity-category__chevron { transform: rotate(180deg); }
.gl-activity-category__body { border-top: 1px solid #dce5f0; padding: 1rem 1.3rem; }
.gl-activity-category__body > p:first-child { color: #7b8493; font-size: .78rem; margin-bottom: .8rem; }
.gl-activity-options { display: grid; grid-template-columns: 1fr 1fr; gap: .2rem 1rem; max-height: 17rem; overflow-y: auto; }
.gl-activity-options .gl-offer { padding-left: 0; }
.gl-activity-options .gl-offer__label { font-size: .78rem; }
.gl-activity-options .gl-offer__unusual { display: none; }
.gl-activity-precision { display: flex; align-items: center; gap: .5rem; color: #8a7449; font-size: .72rem; margin-top: .8rem; }
.gl-activity-precision .gl-icon { width: 1rem; height: 1rem; color: #bd852b; }
.gl-activity-markets { display: grid; grid-template-columns: 1fr 1fr; gap: .35rem 1rem; max-height: 15rem; overflow-y: auto; }
.gl-activity-markets label { display: flex; align-items: center; gap: .5rem; color: #536071; font-size: .78rem; cursor: pointer; }
.gl-selected-profile { border: 1px solid #dce1e9; border-radius: .5rem; padding: 1.6rem; position: sticky; top: 1.5rem; }
.gl-selected-profile > h2 { color: #102f62; font-size: 1.1rem; }
.gl-selected-profile__company { width: 4.5rem; height: 4.5rem; border-radius: 50%; display: grid; place-items: center; color: #174b8d; background: #eef5ff; margin: 1.2rem 0; }
.gl-selected-profile__company .gl-icon { width: 2.3rem; height: 2.3rem; }
.gl-selected-profile section { margin: 1.2rem 0; }
.gl-selected-profile h3 { display: flex; align-items: center; gap: .6rem; color: #173e78; font-size: .85rem; }
.gl-selected-profile h3 .gl-icon { width: 1.1rem; height: 1.1rem; }
.gl-selected-profile section > p { color: #657184; font-size: .82rem; margin: .45rem 0 0 1.7rem; }
.gl-selected-profile__chips { display: flex; flex-wrap: wrap; gap: .35rem; margin: .55rem 0 0 1.7rem; }
.gl-selected-profile__chips button { border: 0; border-radius: .3rem; padding: .3rem .45rem; color: #2867b4; background: #edf5ff; font-size: .68rem; cursor: pointer; }
.gl-selected-profile__chips button span { margin-left: .2rem; }
.gl-selected-profile__info { display: flex; gap: .6rem; border: 1px solid #d6e5f7; border-radius: .35rem; padding: .8rem; color: #3972b6; background: #f2f7fd; font-size: .72rem; line-height: 1.45; }
.gl-selected-profile__info .gl-icon { flex: none; width: 1rem; height: 1rem; }

@media (max-width: 78rem) { .gl-concept-form-grid, .gl-activities-concept-grid { grid-template-columns: 1fr; } .gl-concept-aside-card, .gl-selected-profile { position: static; } }
@media (max-width: 56rem) { .gl-activities-columns { columns: 1; } .gl-verify-form { grid-template-columns: 1fr; } .gl-concept-field--full { grid-column: auto; } .gl-verify-methods, .gl-verify-tip { grid-column: auto; } .gl-confirm-row { grid-template-columns: 1fr 1.5rem; } .gl-confirm-row > span:first-child { grid-column: 1 / -1; } .gl-confirm-description { grid-template-columns: 1fr; } .gl-confirm-description > small { grid-column: 1; } }
@media (max-width: 40rem) { .gl-concept-card__body { padding: 1.4rem; } .gl-concept-card__footer { padding: 1rem 1.4rem; } .gl-verify-method { grid-template-columns: 1.3rem 2.7rem 1fr; } .gl-verify-method__icon { width: 2.7rem; height: 2.7rem; } .gl-activities-title-row { align-items: flex-start; flex-direction: column; gap: .8rem; } .gl-activity-options { grid-template-columns: 1fr; } }

/* PDF concept: a working form and a quiet contextual card side by side. */
.gl-concept-grid,
.gl-activities-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 17rem;
    gap: var(--gl-6);
    align-items: start;
}

.gl-concept-aside,
.gl-profile-preview {
    border: 1px solid var(--gl-line);
    border-radius: var(--r);
    background: var(--gl-surface);
    box-shadow: var(--sh-1);
    padding: var(--gl-5);
    position: sticky;
    top: var(--gl-5);
}

.gl-concept-choice {
    display: flex;
    gap: var(--gl-3);
    border: 1px solid var(--gl-line);
    border-radius: var(--r);
    padding: var(--gl-3);
    margin-top: var(--gl-2);
    cursor: pointer;
}

.gl-concept-choice span { display: grid; gap: .2rem; }
.gl-concept-choice small { color: var(--gl-ink-3); }

.gl-verified-field { position: relative; }
.gl-verified-field span { display: block; color: var(--gl-success); font-size: .78rem; margin-top: .35rem; }

.gl-activities-sections { display: grid; gap: var(--gl-3); }
.gl-activity-card { border: 1px solid var(--gl-line); border-radius: var(--r); background: var(--gl-surface); overflow: hidden; }
.gl-activity-card summary { display: flex; justify-content: space-between; gap: var(--gl-3); padding: var(--gl-4); cursor: pointer; font-weight: 600; }
.gl-activity-card summary b { display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--gl-accent-soft); color: var(--gl-accent); margin-right: .5rem; }
.gl-activity-card summary em { color: var(--gl-ink-3); font-size: .82rem; font-style: normal; font-weight: 400; }
.gl-activity-card__body { border-top: 1px solid var(--gl-line); padding: var(--gl-4); max-height: 32rem; overflow: auto; }

@media (max-width: 70rem) {
    .gl-concept-grid, .gl-activities-layout { grid-template-columns: 1fr; }
    .gl-concept-aside, .gl-profile-preview { position: static; order: -1; }
}

.gl-wizard__panel > .gl-h2 {
    margin: var(--gl-2) 0 var(--gl-3);
}

.gl-wizard__panel .gl-lede {
    margin-bottom: var(--gl-5);
}

.gl-wizard__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gl-3);
    flex-wrap: wrap;
    margin-top: var(--gl-6);
}

/* A lone button stays on the right, where the thumb looks for it. */
.gl-wizard__foot > .gl-btn:only-child {
    margin-left: auto;
}

.gl-wizard__note {
    font-size: 0.875rem;
    color: var(--gl-ink-3);
    line-height: 1.55;
    margin-top: var(--gl-4);
}

.gl-choice__box--square {
    border-radius: 6px;
}

/* --------------------------------------------------------- directory list */

.gl-wizard__results {
    list-style: none;
    margin: var(--gl-5) 0 0;
    padding: 0;
    border: 1px solid var(--gl-line);
    border-radius: var(--r);
    background: var(--gl-surface);
    overflow: hidden;
    box-shadow: var(--sh-1);
}

.gl-wizard__result {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gl-4);
    padding: var(--gl-3) var(--gl-4);
    border-bottom: 1px solid var(--gl-line);
    flex-wrap: wrap;
}

.gl-wizard__result:last-child {
    border-bottom: 0;
}

.gl-wizard__result.is-selected {
    background: var(--gl-accent-soft);
}

.gl-wizard__result-identity {
    display: flex;
    align-items: center;
    gap: var(--gl-3);
    min-width: 0;
}

.gl-wizard__result-identity strong {
    display: block;
    font-weight: 550;
}

.gl-wizard__result-actions {
    display: flex;
    align-items: center;
    gap: var(--gl-3);
    margin-left: auto;
}

.gl-wizard__results-empty {
    margin-top: var(--gl-4);
    font-size: 0.9375rem;
    color: var(--gl-ink-3);
}

/* ------------------------------------------------------------------ chips */

.gl-chip--toggle {
    cursor: pointer;
    user-select: none;
    gap: 0;
}

.gl-chip--toggle input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.gl-chip--toggle:has(input:checked) {
    background: var(--gl-accent-soft);
    border-color: color-mix(in srgb, var(--gl-accent) 45%, var(--gl-line));
    color: var(--gl-accent-deep);
    font-weight: 500;
}

.gl-chip--toggle:has(input:focus-visible) {
    outline: 2px solid var(--gl-accent);
    outline-offset: 2px;
}

/* ------------------------------------------------------- step 2 functions */

/*
 * Function cards. Larger hit area than a plain checkbox row because this is a
 * multi-select answered in seconds, often on a phone at a trade fair.
 */
.gl-fn-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 17rem), 1fr));
    gap: var(--gl-3);
    margin-top: var(--gl-5);
}

.gl-fn {
    display: flex;
    align-items: flex-start;
    gap: var(--gl-3);
    padding: var(--gl-4);
    border: 1px solid var(--gl-line);
    border-radius: var(--r);
    background: var(--gl-surface);
    cursor: pointer;
    transition: border-color 0.25s var(--ease), background 0.25s var(--ease);
}

.gl-fn:hover {
    border-color: color-mix(in srgb, var(--gl-accent) 35%, var(--gl-line));
}

.gl-fn:has(input:checked) {
    border-color: var(--gl-accent);
    background: var(--gl-accent-soft);
}

.gl-fn:has(input:focus-visible) {
    outline: 2px solid var(--gl-accent);
    outline-offset: 2px;
}

.gl-fn__text {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    min-width: 0;
}

.gl-fn__label {
    font-weight: 550;
    line-height: 1.35;
}

.gl-fn__hint {
    font-size: 0.8125rem;
    color: var(--gl-ink-3);
    line-height: 1.45;
}

.gl-fn__flag {
    font-size: 0.6875rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--gl-accent-deep);
}

/* ------------------------------------------------------- step 3 offerings */

.gl-offer-search {
    position: sticky;
    top: 0;
    z-index: 2;
    padding: var(--gl-4) 0;
    background: var(--gl-bg);
}

.gl-offer-section {
    margin-top: var(--gl-6);
    border: 1px solid var(--gl-line);
    border-radius: var(--r);
    background: var(--gl-surface);
    padding: var(--gl-5);
}

.gl-offer-section__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: var(--gl-3);
    flex-wrap: wrap;
    margin-bottom: var(--gl-2);
}

.gl-offer-section__for {
    font-size: 0.75rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--gl-ink-3);
}

.gl-offer-section__title {
    font-size: 1.15rem;
    font-weight: 600;
    letter-spacing: -0.01em;
}

.gl-offer-section__total {
    font-size: 0.8125rem;
    color: var(--gl-accent-deep);
    font-variant-numeric: tabular-nums;
}

/* A group with no match left after filtering disappears rather than sitting
   there as an empty accordion the user keeps opening. */
.gl-taxonomy__group[hidden],
.gl-offer-section[hidden],
.gl-offer[hidden] {
    display: none;
}

/* The shared taxonomy body is a multi-column grid, which is right for flat
   facets and wrong here: this tree carries meaning in its indentation. */
.gl-taxonomy__children.gl-offer-tree {
    display: block;
    padding: 0 0 var(--gl-5) var(--gl-5);
}

.gl-taxonomy__children.gl-offer-tree[hidden] {
    display: none;
}

.gl-offer {
    display: flex;
    align-items: flex-start;
    gap: var(--gl-2);
    padding: 0.2rem 0;
    line-height: 1.4;
}

.gl-offer--child {
    padding-left: var(--gl-4);
}

.gl-offer--grandchild {
    padding-left: var(--gl-6);
}

.gl-offer__label {
    display: flex;
    align-items: baseline;
    gap: var(--gl-2);
    flex-wrap: wrap;
    cursor: pointer;
    min-width: 0;
}

.gl-offer__unusual {
    font-size: 0.6875rem;
    padding: 0.05rem 0.4rem;
    border-radius: var(--r-pill);
    border: 1px solid var(--gl-line);
    color: var(--gl-ink-3);
    white-space: nowrap;
}

.gl-offer__root {
    font-weight: 550;
}

/* The System House question sits under the families that make it meaningful,
   not on a screen of its own -- it is one question, asked in context. */
.gl-system-house {
    margin-top: var(--gl-4);
    padding: var(--gl-4);
    border: 1px solid color-mix(in srgb, var(--gl-accent) 30%, var(--gl-line));
    border-radius: var(--r);
    background: var(--gl-accent-soft);
}

.gl-system-house[hidden] {
    display: none;
}

.gl-system-house__hint {
    font-size: 0.8125rem;
    color: var(--gl-ink-3);
    line-height: 1.5;
    margin-top: var(--gl-2);
}

.gl-offer-empty {
    margin-top: var(--gl-5);
    padding: var(--gl-5);
    border: 1px dashed var(--gl-line);
    border-radius: var(--r);
    color: var(--gl-ink-3);
    text-align: center;
}

.gl-offer-empty[hidden] {
    display: none;
}

/* --------------------------------------------------------- step 4 markets */

.gl-market-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 12rem), 1fr));
    gap: var(--gl-2);
    max-height: 22rem;
    overflow-y: auto;
    padding: var(--gl-3);
    border: 1px solid var(--gl-line);
    border-radius: var(--r);
    background: var(--gl-surface);
}

.gl-market {
    display: flex;
    align-items: center;
    gap: var(--gl-2);
    padding: 0.15rem 0;
    cursor: pointer;
    line-height: 1.4;
}

.gl-market[hidden] {
    display: none;
}

/* ------------------------------------------------------------ primary role */

.gl-role-choice {
    display: grid;
    gap: var(--gl-3);
    margin-top: var(--gl-5);
}

.gl-role-choice__item {
    border: 1px solid var(--gl-line);
    border-radius: var(--r);
    background: var(--gl-surface);
    padding: var(--gl-4);
}

.gl-role-choice__item:has(input:checked) {
    border-color: var(--gl-accent);
    background: var(--gl-accent-soft);
}

.gl-role-choice__head {
    display: flex;
    align-items: center;
    gap: var(--gl-3);
    cursor: pointer;
}

.gl-role-choice__name {
    font-weight: 600;
}

.gl-role-choice__why {
    margin-top: var(--gl-2);
}

.gl-role-choice__why > summary {
    cursor: pointer;
    font-size: 0.8125rem;
    color: var(--gl-accent-deep);
}

.gl-role-choice__evidence {
    margin: var(--gl-2) 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: var(--gl-2);
}

/* Read as a sentence, not as a code: "We manufacture products / Aluminium
   window systems". The two halves are the two questions the company answered. */
.gl-role-choice__evidence {
    flex-direction: column;
    gap: var(--gl-2);
}

.gl-role-choice__evidence li {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: var(--gl-2);
    font-size: 0.875rem;
    padding: 0.25rem 0.6rem;
    border-radius: var(--r-sm);
    background: var(--gl-bg);
    border: 1px solid var(--gl-line);
}

.gl-role-choice__did {
    color: var(--gl-ink-3);
}

.gl-role-choice__what {
    font-weight: 550;
}

/* --------------------------------------------------- add more details (opt) */

.gl-more {
    margin-top: var(--gl-6);
    padding-top: var(--gl-5);
    border-top: 1px dashed var(--gl-line);
}

.gl-more__chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gl-2);
    margin-top: var(--gl-3);
}

.gl-more__chip {
    cursor: pointer;
}

.gl-more__chip[aria-expanded="true"] {
    background: var(--gl-accent-soft);
    border-color: color-mix(in srgb, var(--gl-accent) 45%, var(--gl-line));
    color: var(--gl-accent-deep);
}

.gl-more__fields {
    display: grid;
    gap: var(--gl-4);
    margin-top: var(--gl-4);
}

.gl-more__field[hidden] {
    display: none;
}

.gl-more__field {
    display: grid;
    gap: var(--gl-2);
    padding: var(--gl-4);
    border: 1px solid var(--gl-line);
    border-radius: var(--r);
    background: var(--gl-surface);
}

.gl-more__field-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gl-3);
}

/* ------------------------------------------------------------- notices */

.gl-notice--success {
    border-color: color-mix(in srgb, #1f8a4c 30%, var(--gl-line));
    background: color-mix(in srgb, #1f8a4c 6%, var(--gl-surface));
}

.gl-notice--warning {
    border-color: color-mix(in srgb, #b9770e 35%, var(--gl-line));
    background: color-mix(in srgb, #b9770e 7%, var(--gl-surface));
}

.gl-notice--error {
    border-color: color-mix(in srgb, var(--gl-danger) 35%, var(--gl-line));
    background: var(--gl-danger-soft);
    color: var(--gl-danger);
}

.gl-notice p {
    margin-top: var(--gl-2);
    line-height: 1.55;
}

/* --------------------------------------------------------------- responsive */

@media (max-width: 60rem) {
    .gl-wizard {
        grid-template-columns: 1fr;
    }

    .gl-wizard__rail {
        position: static;
        height: auto;
        padding: var(--gl-5) var(--gl-4);
        gap: var(--gl-5);
    }

    /* On a narrow screen the steps read horizontally: where you are matters,
       what comes next does not. */
    .gl-wizard__steps {
        flex-direction: row;
        overflow-x: auto;
        gap: var(--gl-4);
        padding-bottom: var(--gl-2);
    }

    .gl-wizard__step:not(:last-child)::before {
        display: none;
    }

    .gl-wizard__step-text span {
        display: none;
    }

    .gl-wizard__step {
        white-space: nowrap;
    }

    .gl-wizard__trust {
        margin-top: 0;
    }

    .gl-wizard__main {
        padding: var(--gl-5) var(--gl-4) var(--gl-7);
    }

    .gl-wizard__lede,
    .gl-wizard__heading {
        display: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    .gl-wizard__result,
    .gl-fn,
    .gl-chip--toggle {
        transition: none;
    }
}
