/* Shared illustration styles (Bussola questions + service page heroes). Drawings: assets/illustrations.js */
:root { --illu-soft: #DCD5C4; --illu-bg-a: #F6F1E6; --illu-bg-b: #ECE5D3; }
@media (prefers-color-scheme: dark) { :root { --illu-soft: #3B3844; --illu-bg-a: #24222B; --illu-bg-b: #1B1A21; } }
.q-layout { display: grid; grid-template-columns: 1fr; gap: 26px; }
.q-illu { order: -1; }
.illu {
  border-radius: 30px; aspect-ratio: 320 / 220; overflow: hidden; position: relative;
  background: radial-gradient(ellipse 70% 80% at 80% 0%, rgba(242,169,59,.22), transparent 60%), linear-gradient(145deg, var(--illu-bg-a), var(--illu-bg-b));
  border: 1px solid var(--card-line);
}
.illu svg { width: 100%; height: 100%; display: block; }
.illu.in svg { animation: illuIn .6s cubic-bezier(.2,.7,.2,1) both; }
@keyframes illuIn { from { opacity: 0; transform: translateY(14px) scale(.96); } to { opacity: 1; transform: none; } }
.illu .float { animation: illuFloat 6s ease-in-out infinite; transform-box: fill-box; }
@keyframes illuFloat { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@media (prefers-reduced-motion: reduce) { .illu .float, .illu.in svg { animation: none; } }
.illu .o, .illu .card-o { fill: var(--card); stroke: var(--ink); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.illu .bea { fill: var(--beacon); }
.illu .ink { fill: var(--ink); }
.illu .mid { fill: var(--ink-soft); }
.illu .soft { fill: var(--illu-soft); }
.illu .s-ink, .illu .s-soft, .illu .s-bea, .illu .s-street { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.illu .s-ink { stroke: var(--ink); stroke-width: 2.5; }
.illu .s-soft { stroke: var(--illu-soft); stroke-width: 2.5; }
.illu .s-bea { stroke: var(--beacon); stroke-width: 3.5; }
.illu .s-street { stroke: var(--card); stroke-width: 9; }
.illu .pap { fill: var(--paper); }
.illu .pap.s-ink { fill: var(--paper); }
.illu .stroke-i { stroke: var(--ink); stroke-width: 2.5; stroke-linejoin: round; }
.illu .s-bea-box { stroke: var(--beacon); stroke-width: 3; }