/* Carleton University case study. Builds on site.css and the story kit in time.css; only the case study's own pieces live here.
   The hero figure is a static "at a glance" card rather than an animation: the page tells one customer's results. */

.glance {
    display: grid;
    gap: 18px;
    padding: clamp(22px, 3vw, 32px);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    background: var(--surface);
}

/* The university's logo is dark on white, so it keeps a white tile in both themes */
.glance-logo {
    width: 104px;
    height: 104px;
    border-radius: 50%;
    border: 3px solid var(--green);
    background: #ffffff;
    object-fit: contain;
}

.glance-title {
    font-size: 1.35rem;
}

.glance h3 {
    margin-bottom: 8px;
    font-variation-settings: "wdth" 110;
    font-size: 1rem;
}

.glance .checklist {
    margin-top: 0;
    gap: 8px;
}

.glance-cols {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
    font-size: 0.95rem;
}

.case-proof {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.case-quote {
    display: grid;
    gap: 22px;
    padding: clamp(24px, 3vw, 36px);
    border-radius: var(--radius-lg);
    background: var(--signal-soft);
}

.case-quote blockquote p {
    font-variation-settings: "wdth" 110;
    font-weight: 600;
    font-size: clamp(1.2rem, 2vw, 1.45rem);
    line-height: 1.4;
}

.case-quote figcaption {
    display: flex;
    align-items: center;
    gap: 14px;
}

.case-quote img {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    flex: 0 0 auto;
}

.case-quote figcaption span {
    display: flex;
    flex-direction: column;
    font-size: 0.9rem;
    color: var(--ink-soft);
}

.case-quote figcaption b {
    font-size: 1rem;
    color: var(--ink);
}

@media (max-width: 1080px) {
    .case-proof {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .glance-cols,
    .case-proof {
        grid-template-columns: minmax(0, 1fr);
    }
}