/* Photo cards and native interface illustrations match the Particle case study. */
.aq-scene-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:36px}
.aq-scene-card{overflow:hidden;border-radius:20px;background:#f0f3fb;border:1px solid #e0e5f0}
.aq-scene-card:nth-child(2){background:#f1eef8}
.aq-scene-card img{display:block;width:100%;height:auto;aspect-ratio:1672/941;object-fit:cover}
.aq-scene-card>div{padding:28px}
.aq-scene-card h3{font-size:22px;line-height:1.25;margin:0 0 14px}
.aq-scene-card p{font-size:16px;line-height:1.65;color:var(--sub);margin:0}
.aq-image-note{font-size:12px;color:var(--sub);margin:12px 0 0}
.aq-visual{display:grid;grid-template-columns:1fr 1fr;gap:26px 40px;margin:40px auto;max-width:1040px;align-items:center}
.aq-visual figcaption{grid-column:1/-1;font-size:12px;line-height:1.6;color:var(--sub)}
.aq-interface.pdemo{height:320px;margin:0;font-family:'Hanken Grotesk',sans-serif;border-radius:16px}
.aq-interface .mini-window,.aq-interface .mini-console{width:82%;padding:18px;border-radius:14px}
.aq-interface .mini-toolbar{font-size:14px;margin-bottom:18px}
.aq-interface .mini-board{height:128px;gap:9px}
.aq-interface .mini-board em{height:auto;background:none;font-style:normal;font-size:12px;color:#596475;margin:0 0 10px;width:auto}
.aq-interface .mini-tile{padding:12px 8px;margin-bottom:10px}
.aq-interface .mini-chip{font-size:12px;right:22px;bottom:28px;padding:10px 14px;color:#273544}
.aq-save-line{display:flex;justify-content:space-between;font-size:12px;margin-top:16px;color:#596475}
.aq-save-line span:last-child{color:#286654;font-weight:700}
.aq-visual-copy h3{font-size:24px;line-height:1.3;margin:0 0 22px}
.aq-visual-copy ol{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.aq-visual-copy li{border-left:2px solid #c9c5e3;padding-left:16px}
.aq-visual-copy strong{display:block;font-size:16px;margin-bottom:4px}
.aq-visual-copy li span{display:block;font-size:15px;line-height:1.6;color:var(--sub)}
.aq-check-row{display:flex;align-items:center;gap:12px;font-size:14px;padding:10px 0;border-bottom:1px solid #e6e9eb}
.aq-check-row>b{margin-left:auto;width:38px;height:5px;border-radius:3px;background:#d7e3df}
.aq-check-mark{display:grid;place-items:center;width:24px;height:24px;border-radius:6px;background:#e4f0e9;color:#276653;font-weight:700}
.aq-repair-line{display:block;width:100%;height:38px;margin-top:4px}
.aq-route-base{fill:none;stroke:#c4d4cd;stroke-width:2}
.aq-route{fill:none;stroke:#427a65;stroke-width:2.5;stroke-dasharray:1;stroke-dashoffset:0}
.aq-document{position:absolute;width:55%;height:185px;padding:20px;border-radius:12px;background:#f7fafc;border:1px solid #dce4ec;box-shadow:0 14px 24px #14263b30;color:#273544}
.aq-document-back{left:9%;top:40px;transform:rotate(-8deg);background:#e8eef5}
.aq-document-front{right:9%;top:76px;transform:rotate(5deg)}
.aq-document strong{display:block;font-size:14px;margin-bottom:20px}
.aq-document i{display:block;height:5px;background:#cbd6df;margin:10px 0;border-radius:3px}
.aq-document i:nth-of-type(2){width:78%}.aq-document i:nth-of-type(3){width:60%}
.aq-document small{display:block;margin-top:16px;font-size:11px;color:#5a6876}
.aq-doc-heading{display:block;width:38%;height:9px;background:#739aa3;border-radius:3px}
.aq-planned{position:absolute;bottom:17px;right:20px;left:20px;text-align:center;padding:9px;border:1px dashed #b4c9d8;border-radius:8px;color:#f1f6fa;font-size:12px}
@media(max-width:759px){.aq-scene-grid{grid-template-columns:1fr;max-width:556px;margin-left:auto;margin-right:auto}.aq-scene-card>div{padding:24px}.aq-visual{grid-template-columns:1fr;max-width:556px;gap:24px}.aq-interface.pdemo{height:310px}.aq-visual-copy h3{font-size:22px}.aq-visual-copy ol{gap:16px}}
@media(max-width:380px){.aq-interface.pdemo{height:280px}.aq-interface .mini-window,.aq-interface .mini-console{padding:12px;width:87%}.aq-interface .mini-toolbar{font-size:12px}.aq-check-row{font-size:12px;gap:8px}.aq-document{padding:14px;width:60%}.aq-document strong{font-size:12px}.aq-document small{font-size:10px}.aq-interface .mini-chip{font-size:10px;right:12px;bottom:18px}.aq-planned{font-size:11px}}

/* Overlapping vector interfaces, using the existing Particle illustration palette. */
.aiqa .aq-hero-art{position:relative;flex:0 0 46%;min-width:0;margin:30px -12px 30px 0}
.aq-hero-art img{display:block;width:100%;height:auto}
@media(max-width:1024px){.aiqa .aq-hero-art{flex:none;width:min(100%,560px);align-self:center;margin:0 0 40px}}
@media(max-width:600px){.aiqa .aq-hero-art{margin-bottom:26px}}
