/* Servizi (server/views/services.mjs): schede dei servizi (serviceCard di site.css), come si prenota in quattro passi, domande frequenti. */

.svc-grid { align-items: stretch; row-gap: clamp(24px, 3vw, 40px); }
.svc-grid > .service-card { height: 100%; }
/* i pulsanti «Richiedi un preventivo» di una riga allineati in fondo alla scheda */
.svc-grid .service-card__body { display: flex; flex-direction: column; gap: 16px; }
.svc-grid .service-card__foot { margin-top: auto; }
.svc-grid .service-card__body > p:not([class]) { color: var(--muted); font-size: var(--fs-small); }

/* ---- come si prenota */
.svc-steps__list { display: grid; gap: var(--gap); counter-reset: none; }
@media (min-width: 640px) { .svc-steps__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .svc-steps__list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.svc-step { position: relative; display: grid; gap: 14px; align-content: start; padding: clamp(22px, 2.6vw, 32px); border-top: 1px solid var(--accent); background: linear-gradient(180deg, rgba(212, 180, 131, .06), transparent 60%); }
.svc-step__num { font: 300 clamp(2.8rem, 2.2rem + 2vw, 3.8rem)/1 var(--font-display); color: var(--accent); font-variant-numeric: lining-nums; }
.svc-step__icon { position: absolute; top: clamp(22px, 2.6vw, 32px); right: clamp(22px, 2.6vw, 32px); display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line-2); color: var(--accent-2); }
.svc-step__icon .i { width: 19px; height: 19px; }
.svc-step__title { font-size: clamp(1.45rem, 1.3rem + .5vw, 1.8rem); }
.svc-step__text { color: var(--muted); font-size: var(--fs-small); }

/* ---- domande frequenti: titolo a sinistra, risposte a destra sul computer */
.svc-faq__grid { display: grid; gap: clamp(8px, 2vw, 32px) clamp(40px, 6vw, 104px); }
.svc-faq__grid > * { min-width: 0; }
@media (min-width: 1000px) { .svc-faq__grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); align-items: start; } }
.svc-faq__list .accordion__group:first-child { margin-top: 0; }