/* =========================================================================
   TEMPLATE: single-case-studies
   Layout/ritmo generale. Lo stile di dettaglio è nei singoli widget.
   ========================================================================= */

:root {
    --cs-red: #E30613;
    --cs-ink: #111827;       /* gray-900 */
    --cs-text: #374151;      /* gray-700 */
    --cs-muted: #6b7280;     /* gray-500/600 */
    --cs-bg-soft: #f5f5f5;   /* neutral-100 */
    --cs-border: #e5e7eb;    /* gray-200 */
    --cs-radius: 10px;
    --cs-maxw: 1320px;
}

.single-case-study {
    color: var(--cs-text);
    font-family: 'DIN Pro', sans-serif!important;
}

.single-case-study h1.cs-hero-title,
.single-case-study h2.cs-h2{
    font-family: 'DIN Pro', sans-serif!important;
}

/* La padding verticale è gestita dal wrap interno di ciascun widget, così le
   sezioni vuote (widget auto-nascosto) non lasciano spazi: il <section> esterno
   viene comunque emesso dal framework ma resta a altezza zero. */
.single-case-study .cs-section {
    padding: 0;
}

.single-case-study .cs-section--soft {
    background: rgba(245, 245, 245, .95);
}

.single-case-study .container {
    max-width: var(--cs-maxw);
    margin-inline: auto;
    padding-inline: 24px;
}

/* Titoli di sezione */
.single-case-study .cs-h2 {
    color: var(--cs-ink);
    font-weight: 700;
    font-size: clamp(28px, 3.4vw, 40px);
    line-height: 1.1;
    margin: 0 0 16px;
}

.single-case-study .cs-lead {
    font-size: clamp(16px, 1.4vw, 18px);
    line-height: 1.6;
    color: var(--cs-text);
}

/* Bottone/CTA brand */
.single-case-study .cs-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 28px;
    background: var(--cs-red);
    color: #fff;
    border-radius: 20px;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
    transition: filter .2s ease;
}

.single-case-study .cs-btn:hover {
    filter: brightness(.92);
    color: #fff;
}

/* Breadcrumb spacing */
.single-case-study .cs-breadcrumb {
    padding: 24px 0 0;
}

/* Spaziatura verticale comune dei wrap interni */
.single-case-study .cs-hero-wrap { padding: 48px 0 56px; }
.single-case-study .cs-cards-wrap { padding: 64px 0; }
.single-case-study .cs-steps-wrap { padding: 64px 0; }
.single-case-study .cs-form-wrap { padding: 64px 0; }

@media (max-width: 767px) {
    .single-case-study .cs-hero-wrap,
    .single-case-study .cs-cards-wrap,
    .single-case-study .cs-steps-wrap,
    .single-case-study .cs-form-wrap { padding: 40px 0; }
    .cs-text-media .cs-text-media-wrap,
    .cs-features .cs-features-wrap { padding: 40px 0 !important; }
}