/* Art direction: perception, signal, or typography. Original content remains intact. */
.hero-visual{background:#eeeee6;color:var(--ink);border:1px solid #dde1d8;border-radius:3px}
.visual-top{border-bottom:1px solid #d6ddd3;color:var(--teal);padding:22px 26px}
.visual-top>span.visual-index{font-size:10px;letter-spacing:.1em;color:var(--muted)}
.hero-visual>img{height:auto;aspect-ratio:1.4;object-fit:cover;object-position:center}
#hero-art[hidden]{display:none}
.visual-caption{background:#eeeee6;color:var(--muted);padding:23px 26px;font-size:13px}
.visual-caption strong{color:var(--ink);font-weight:550}
.circle-arrow{border-color:#adbeb0;color:var(--teal)}
.service-top{align-items:center;min-height:66px;margin-bottom:20px}
.service-top img.method-symbol{width:56px;height:56px;object-fit:contain;border-radius:0}
.project-visual{padding:23px 27px 20px;background:#e8eee5;border-bottom:1px solid #d4dfd1}
.project-method{font-size:10px;letter-spacing:.15em;font-weight:600;color:#315e4c}
.project-mark{display:flex;justify-content:space-between;align-items:center;gap:25px;padding-block:14px}
.project-mark img{width:70px;height:70px;object-fit:contain}
.project-mark>span{font-family:Georgia,serif;font-size:80px;line-height:1;color:#a5b7a9;letter-spacing:-.06em}
.project-context{font-size:12px;color:#3c5d50}
.visual-signal{background:#e9efe7}
.visual-signal .visual-caption{background:#e9efe7}
.visual-signal .visual-top{background:#e9efe7}
.editorial-art{padding:33px 30px 27px;background:var(--ink);color:#f4f2e8;min-height:375px;display:flex;flex-direction:column;justify-content:center}
.editorial-art[hidden]{display:none}
.editorial-art>span{font-size:clamp(46px,4.5vw,68px);line-height:1.12;letter-spacing:-.045em;font-weight:400}
.editorial-art>span:nth-child(2){color:var(--mint);font-family:Georgia,serif;font-style:italic}
.editorial-rule{height:1px;background:#647d80;margin:28px 0 18px;width:100%}
.editorial-art small{font-size:9px;letter-spacing:.18em;color:#d0dfd9}
.visual-editorial{background:var(--ink);border-color:var(--ink)}
.visual-editorial .visual-top{background:var(--ink);border-color:#4a6570;color:#c6dbd1}
.visual-editorial .visual-top>span.visual-index{color:#c6dbd1}
.visual-editorial .visual-caption{background:var(--ink);color:#ccdcda;border-top:1px solid #4a6570}
.visual-editorial .visual-caption strong{color:#f1f3eb}
.visual-editorial .circle-arrow{border-color:#728e83;color:var(--mint)}
@media(max-width:800px) and (min-width:561px){.hero-visual>img{aspect-ratio:1;height:320px}.visual-top,.visual-caption{padding:20px 18px}.editorial-art{padding:30px 20px;min-height:320px}.editorial-art>span{font-size:40px}}
@media(max-width:560px){.hero-visual>img{height:auto;aspect-ratio:1.4}.visual-top{padding:17px 20px;font-size:9px}.visual-caption{padding:20px;font-size:13px}.visual-top .visual-index{font-size:9px}.service-top img.method-symbol{width:48px;height:48px}.service-top{min-height:52px}.editorial-art{min-height:290px;padding:28px}.editorial-art>span{font-size:48px}.project-visual{padding:22px 25px}.project-mark>span{font-size:72px}}

/* Explain the value before naming the research tools. */
.customer-insights .wrap{display:grid;grid-template-columns:190px minmax(0,1fr);gap:30px;padding-block:27px;align-items:center}
.customer-insights .eyebrow{margin:0;font-size:10px;letter-spacing:.12em;line-height:1.7;color:#286452}
.customer-insights ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1.25fr .8fr .85fr 1.2fr;gap:24px;align-items:center}
.customer-insights li{font-size:14px;line-height:1.5;font-weight:500;color:#112f3a}
@media(max-width:1100px){.customer-insights .wrap{grid-template-columns:1fr;gap:16px}.customer-insights ul{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:600px){.customer-insights .wrap{padding-block:24px;gap:18px}.customer-insights ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px}.customer-insights li{font-size:14px}}

/* Team: two centred profiles above three, in confirmed reading order. */
.team-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:46px 30px;max-width:1040px;margin-inline:auto;align-items:start}
.team-grid>.person{grid-column:span 2}
.team-grid>.person:nth-child(1){grid-column:2 / span 2;grid-row:1}
.team-grid>.person:nth-child(2){grid-column:4 / span 2;grid-row:1}
.team-grid>.person:nth-child(3){grid-column:1 / span 2;grid-row:2}
.team-grid>.person:nth-child(4){grid-column:3 / span 2;grid-row:2}
.team-grid>.person:nth-child(5){grid-column:5 / span 2;grid-row:2}
.team-grid .person>img,.team-grid .portrait>img{aspect-ratio:1/1.08;object-fit:cover}
.team-grid .person h3{font-size:22px}
.team-grid .person .role{font-size:14px;min-height:44px}
@media(max-width:800px){.team-grid{gap:34px 20px}.team-grid .person h3{font-size:19px}.team-grid .person .role{font-size:12px}}
@media(max-width:600px){.team-grid{grid-template-columns:minmax(0,1fr);max-width:360px;gap:35px}.team-grid>.person:nth-child(n){grid-column:1;grid-row:auto}.team-grid .person h3{font-size:24px}.team-grid .person .role{font-size:14px;min-height:0}.team-grid .person details p{font-size:15px}.team-grid .person summary{font-size:14px}}

.team-grid .claudio-portrait{aspect-ratio:1/1.08;overflow:hidden;border-radius:3px;background:var(--wash)}
.team-grid .claudio-portrait>img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;transform:scale(1.65);transform-origin:54% 38%}

/* Images stay inside the native summary, visible before expansion. */
.project summary.application-summary{display:block}
.project .application-summary>.application-toggle-line{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;font-size:13px;font-weight:600;transform:none}
.application-plus{font-size:23px;font-weight:400;line-height:1;flex-shrink:0}
.project details[open]>.application-summary .application-plus{transform:rotate(45deg)}
.project .application-preview{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;margin-top:16px;border-radius:2px;background:#f3f0e5}
.project .application-summary>.application-caption{display:block;margin-top:8px;color:var(--muted);font-size:10px;font-weight:400;line-height:1.5;transform:none}
.application-summary:hover .application-toggle-line{color:var(--teal)}
@media(min-width:561px) and (max-width:800px){#projects>.projects-grid>.project:last-child{grid-column:auto}}