/* =====================================================================
   CIMA ENGINEERING — tema "cima" (dal mockup 2 accettato, css/style_2.css)
   Foglio di stile unico. Palette e font estratti dal sito originale.
   Strutturato per blocchi, pronto per la conversione in CakePHP.
   ===================================================================== */

/* ---------------------------------------------------------------------
   VARIABILI / PALETTE (estratta da ORIGINALE/home_files/main.css)
   --------------------------------------------------------------------- */
:root {
    --cima-red:       #e3001b; /* colore principale: nav, bottoni, CTA */
    --cima-red-dark:  #b30015; /* hover del colore principale */
    --cima-text:      #2b2b2b; /* testo corrente (scurito per maggior contrasto) */
    --cima-heading:   #1f1f1f; /* titoli (scuriti per maggior contrasto) */
    --cima-muted:     #6a6a6a; /* testi secondari / copyright (contrasto AA su sfondo chiaro) */
    --cima-bg:        #f7f7f7; /* sfondo pagina */
    --cima-white:     #ffffff; /* sfondo sezioni chiare */
    --cima-dark:      #212121; /* overlay banner / barre scure */
    --cima-border:    #e0e0e0; /* bordi tenui */
}

/* ---------------------------------------------------------------------
   BASE
   --------------------------------------------------------------------- */
body.cima-body {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400; /* da 300 a 400: testo meno sottile, più leggibile */
    color: var(--cima-text);
    background: var(--cima-bg);
    line-height: 1.65;
}

.cima-body h1 {
    font-weight: 600;
    color: var(--cima-white);
}


.cima-body h2,
.cima-body h3 {
    font-weight: 600;
    color: var(--cima-heading);
}

.cima-body a {
    color: var(--cima-red);
    text-decoration: none;
    transition: color .2s ease-in-out;
}

.cima-body a:hover {
    color: var(--cima-red-dark);
}

/* Bottone principale coerente col sito originale */
.cima-btn {
    display: inline-block;
    background: var(--cima-red);
    color: #fff;
    font-weight: 600;
    letter-spacing: .02em;
    padding: .7em 1.6em;
    border: 0;
    border-radius: 4px;
    transition: background .2s ease-in-out, color .2s ease-in-out;
}

.cima-btn:hover {
    background: var(--cima-red-dark);
    color: #fff;
}

/* Bottone su fondo rosso (sezione CTA): bianco con testo scuro */
.cima-btn--light {
    background: #fff;
    color: var(--cima-heading);
}

.cima-btn--light:hover {
    background: #fff;
    color: var(--cima-red);
}

/* ---------------------------------------------------------------------
   BLOCCO: header (loghi)
   --------------------------------------------------------------------- */
.cima-header {
    background: var(--cima-white);
    padding: 1.5rem 0;
}

.cima-logo {
    max-height: 120px;
    width: auto;
    max-width: 100%;
    border-radius: 8px; /* angoli ammorbiditi sul JPG a sfondo bianco */
}

/* ---------------------------------------------------------------------
   BLOCCO: nav (barra menu rossa)
   --------------------------------------------------------------------- */
.cima-nav {
    /* Aspetto metallizzato: gradiente verticale con sfumatura chiara in alto
       (riflesso speculare) e più scura in basso, sul rosso aziendale. */
    background: linear-gradient(180deg,
        #ff3547 0%,
        #e3001b 42%,
        #c00016 60%,
        #8f0011 100%);
    /* riflesso lucido superiore + ombreggiatura inferiore per dare volume */
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .45),
        inset 0 -3px 6px rgba(0, 0, 0, .35);
    /* barra bloccata in alto durante lo scroll */
    position: sticky;
    top: 0;
    z-index: 1030;
    transition: padding .25s ease, box-shadow .25s ease;
}

/* Stato compatto: attivato via JS quando si scorre oltre l'hero.
   La barra diventa una riga sola e slanciata, con un'ombra di distacco
   dal contenuto (il riflesso metallico resta). */
.cima-nav--compact {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .45),
        inset 0 -3px 6px rgba(0, 0, 0, .35),
        0 .35rem .9rem rgba(0, 0, 0, .3);
}

.cima-nav--compact .navbar-nav .nav-link {
    padding-top: .55rem;
    padding-bottom: .55rem;
}

/* Il container fa da riferimento per i loghi posizionati alle estremità */
.cima-nav .container {
    position: relative;
}

/* Loghi nella barra: JPG a sfondo bianco "vestiti" in un chip arrotondato.
   Nascosti di default, compaiono alle estremità in stato compatto. */
.cima-nav__logo {
    position: absolute;
    top: 50%;
    height: 52px;
    width: auto;
    background: #fff;
    padding: 4px 10px;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .3);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-50%) scale(.85);
    transition: opacity .25s ease, transform .25s ease;
    z-index: 5;
}

.cima-nav__logo--left  { left: 0; }
.cima-nav__logo--right { right: 0; }

.cima-nav--compact .cima-nav__logo {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(-50%) scale(1);
}

.cima-nav .navbar-nav .nav-link {
    color: #fff;
    font-weight: 600;
    font-size: 1.15rem;
    padding: 1.1rem 1.35rem;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .35); /* stacco sul fondo metallico */
    transition: background .2s ease-in-out;
}

.cima-nav .navbar-nav .nav-link:hover,
.cima-nav .navbar-nav .nav-link:focus {
    color: #fff;
    background: rgba(0, 0, 0, .12);
}

.cima-nav .navbar-nav .nav-link.active {
    background: rgba(0, 0, 0, .18);
}

.cima-nav .navbar-toggler {
    border-color: rgba(255, 255, 255, .5);
}

.cima-nav .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,0.9)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

/* Dropdown "Macchine" coerente con il sito originale (fondo scuro) */
.cima-nav .dropdown-menu {
    background: #333;
    border: 0;
    border-radius: 0 0 5px 5px;
}

.cima-nav .dropdown-menu .dropdown-item {
    color: #c0c0c0;
    font-weight: 600;
}

.cima-nav .dropdown-menu .dropdown-item:hover {
    color: #fff;
    background: var(--cima-red);
}

/* ---------------------------------------------------------------------
   BLOCCO: hero / banner
   --------------------------------------------------------------------- */
.cima-hero {
    position: relative;
    min-height: 40em;
    background-size: cover;
    background-position: center center;
    display: flex;
    align-items: center; /* testo verticalmente centrato */
}

/* Overlay a gradiente: più scuro a sinistra per leggibilità del testo */
.cima-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
        rgba(27, 27, 27, .85) 0%,
        rgba(27, 27, 27, .55) 45%,
        rgba(27, 27, 27, .15) 100%);
}

/* Blocco testo allineato a sinistra, sopra l'overlay */
.cima-hero__content {
    position: relative;
    z-index: 1;
    color: #fff;
    max-width: 40rem;
    text-align: left;
    padding: 2rem 0;
}

.cima-hero__title {
    color: #fff;
    margin: 0 0 1rem;
    font-size: 3rem;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: .01em;
    /* Effetto tridimensionale: estrusione a strati verso il basso-destra
       + ombra di distacco per staccare il testo dallo sfondo. */
    text-shadow:
        1px 1px 0 #c9000f,
        2px 2px 0 #b30015,
        3px 3px 0 #9a0012,
        4px 4px 0 #83000f,
        5px 5px 0 #6c000c,
        6px 6px 10px rgba(0, 0, 0, .55);
}

.cima-hero__text {
    color: rgba(255, 255, 255, .9);
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
}

/* ---------------------------------------------------------------------
   BLOCCO: sezioni generiche
   --------------------------------------------------------------------- */
.cima-section {
    padding: 4.5rem 0 3rem;
}

.cima-section--white {
    background: var(--cima-white);
}

.cima-section--muted {
    /* stessa finitura metallizzata delle intro-card */
    background: linear-gradient(150deg,
        #ffffff 0%,
        #eef1f4 40%,
        #dde2e7 70%,
        #cfd5db 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .9),
        inset 0 -3px 6px rgba(0, 0, 0, .06);
}

/* Blocco intro-card: più respiro sopra e sotto.
   overflow-x nascosto per contenere lo slide-in orizzontale delle card. */
.cima-section--cards {
    padding-top: 7rem;
    padding-bottom: 7rem;
    overflow-x: hidden;
}

.cima-section__title {
    text-align: center;
    margin-bottom: 2.5rem;
}

/* Testo più contrastato nella sezione highlight ("Professionalità e qualità") */
.cima-section--muted p {
    color: #1f1f1f;
    font-weight: 400;
}

/* Card intro (Chi siamo / Servizi / Contatti) — finitura metallizzata */
.cima-card {
    position: relative;
    overflow: hidden; /* contiene il riflesso animato */
    /* gradiente diagonale argento con banda chiara: effetto metallo spazzolato */
    background: linear-gradient(150deg,
        #ffffff 0%,
        #eef1f4 40%,
        #dde2e7 70%,
        #cfd5db 100%);
    border: 1px solid #c9cfd6;
    border-radius: 6px;
    padding: 2rem 1.75rem;
    height: 100%;
    text-align: center;
    /* riflesso lucido superiore + bordo inferiore scuro per dare spessore metallico */
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .9),
        inset 0 -2px 3px rgba(0, 0, 0, .06),
        0 .3rem .7rem rgba(0, 0, 0, .06);
    transition: box-shadow .2s ease-in-out, transform .2s ease-in-out;
}

.cima-card:hover {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .9),
        inset 0 -2px 3px rgba(0, 0, 0, .08),
        0 .8rem 1.6rem rgba(0, 0, 0, .14);
    transform: translateY(-4px);
}

/* Glare metallico che attraversa la card in diagonale all'ingresso.
   Parte fuori scena a sinistra e viene animato quando la card diventa
   visibile (classe .is-visible aggiunta dall'IntersectionObserver). */
.cima-card::after {
    content: "";
    position: absolute;
    top: 0;
    left: -80%;
    width: 55%;
    height: 100%;
    background: linear-gradient(120deg,
        transparent 0%,
        rgba(255, 255, 255, .75) 50%,
        transparent 100%);
    transform: skewX(-20deg);
    opacity: 0;
    pointer-events: none;
}

.cima-card.is-visible::after {
    animation: cima-shine 1.1s ease-out .35s 1;
}

@keyframes cima-shine {
    0%   { left: -80%; opacity: 0; }
    15%  { opacity: 1; }
    100% { left: 130%; opacity: 0; }
}

.cima-card__icon {
    width: 84px;
    height: auto;
    margin-bottom: 1.25rem;
}

.cima-card__text {
    text-align: left;
    font-size: .95rem;
}

/* Blocco post/servizi (immagine + testo) — finitura metallizzata come le card */
.cima-post {
    /* gradiente diagonale argento (visibile dietro il corpo testo) */
    background: linear-gradient(150deg,
        #ffffff 0%,
        #eef1f4 40%,
        #dde2e7 70%,
        #cfd5db 100%);
    border: 1px solid #c9cfd6;
    border-radius: 6px; /* stesso radius delle card della sezione superiore */
    overflow: hidden;
    height: 100%;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .9),
        inset 0 -2px 3px rgba(0, 0, 0, .06),
        0 .3rem .7rem rgba(0, 0, 0, .06);
    transition: box-shadow .2s ease-in-out, transform .2s ease-in-out;
}

.cima-post:hover {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .9),
        inset 0 -2px 3px rgba(0, 0, 0, .08),
        0 .8rem 1.6rem rgba(0, 0, 0, .14);
    transform: translateY(-4px);
}

.cima-post__img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
}

.cima-post__body {
    padding: 1.5rem;
}

.cima-post__title {
    text-align: center;
    margin-bottom: .75rem;
}

/* ---------------------------------------------------------------------
   BLOCCO: contatti (sfondo metallizzato, mappa + form)
   --------------------------------------------------------------------- */
.cima-contact {
    /* stessa finitura metallizzata delle card */
    background: linear-gradient(150deg,
        #ffffff 0%,
        #eef1f4 40%,
        #dde2e7 70%,
        #cfd5db 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .9),
        inset 0 -3px 6px rgba(0, 0, 0, .06);
}

/* Contenitore mappa: riempie l'altezza della colonna, bordo scuro coerente */
.cima-map {
    border: 2px solid #000;
    border-radius: 6px;
    overflow: hidden;
    min-height: 340px;
    display: flex;
}

.cima-map iframe {
    width: 100%;
    height: 100%;
    min-height: 340px;
    border: 0;
    display: block;
}

/* ---------------------------------------------------------------------
   BLOCCO: footer
   --------------------------------------------------------------------- */
.cima-footer {
    /* stesso rosso metallizzato dell'header/nav */
    background: linear-gradient(180deg,
        #ff3547 0%,
        #e3001b 42%,
        #c00016 60%,
        #8f0011 100%);
    color: rgba(255, 255, 255, .92);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4);
    padding: 3.5rem 0 1.5rem;
    border-top: 0;
}

.cima-footer h3 {
    color: #fff;
    font-size: 1.05rem;
    margin-bottom: 1rem;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .3);
}

.cima-footer a {
    color: rgba(255, 255, 255, .92);
}

.cima-footer a:hover {
    color: #fff;
    text-decoration: underline;
}

.cima-footer__links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.cima-footer__links li {
    margin-bottom: .4rem;
}

.cima-footer__bottom {
    color: rgba(255, 255, 255, .8);
    font-size: .85rem;
    text-align: center;
    margin-top: 2.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, .25);
}

/* Icone social (SVG inline, colore ereditato via currentColor).
   Su fondo rosso metallico: contorno bianco, hover a pastiglia bianca. */
.cima-social__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 0 .5rem 0 0;
    border-radius: 50%;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .6);
    transition: color .2s ease-in-out, border-color .2s ease-in-out, background .2s ease-in-out;
}

.cima-social__icon:hover {
    color: var(--cima-red);
    background: #fff;
    border-color: #fff;
}

/* =====================================================================
   ANIMAZIONI D'INGRESSO (riutilizzabili, sopravvivono a CakePHP)
   Fade-in con leggera traslazione verso l'alto, attivate allo scroll.
   L'elemento parte da .anim-fade-up e riceve .is-visible via JS.
   Delay progressivo applicato inline con --anim-delay dal JS.
   ===================================================================== */
.anim-fade-up {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity .6s ease-out, transform .6s ease-out;
    transition-delay: var(--anim-delay, 0s);
    will-change: opacity, transform;
}

.anim-fade-up.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Variante più marcata: usata nella griglia servizi (traslazione + scala,
   durata maggiore) per rendere l'ingresso più visibile. */
.anim-fade-up--strong {
    transform: translateY(64px) scale(.94);
    transition: opacity .85s ease-out, transform .85s cubic-bezier(.2, .7, .2, 1);
}

/* Variante slide-in: la card entra scorrendo da sinistra verso destra
   quando compare durante lo scroll (usata sulle intro-card). */
.anim-fade-up--slide {
    transform: translateX(-70px);
    transition: opacity 1.1s ease-out, transform 1.1s cubic-bezier(.2, .7, .2, 1);
}

.anim-fade-up--slide.is-visible {
    transform: translateX(0);
}

/* Variante flip 3D verticale: la card si ribalta dall'alto verso il basso,
   come un pannello metallico che va al suo posto (usata sui post servizi). */
.anim-fade-up--flip {
    transform-origin: top center;
    transform: perspective(900px) rotateX(-90deg);
    transition: opacity .8s ease-out, transform .8s cubic-bezier(.2, .7, .2, 1);
}

.anim-fade-up--flip.is-visible {
    transform: perspective(900px) rotateX(0deg);
}

/* Rispetto delle preferenze utente: nessuna animazione se richiesto */
@media (prefers-reduced-motion: reduce) {
    .anim-fade-up {
        opacity: 1;
        transform: none;
        transition: none;
    }
    .cima-card:hover,
    .cima-post:hover {
        transform: none;
    }
    .cima-card.is-visible::after {
        animation: none;
    }
}

/* ---------------------------------------------------------------------
   RESPONSIVE (integra le convenzioni Bootstrap 5)
   --------------------------------------------------------------------- */
@media (max-width: 991.98px) {
    .cima-hero__title {
        font-size: 1.8rem;
    }
    .cima-nav .navbar-nav .nav-link {
        padding: .6rem 1rem;
    }
    /* Su mobile il menu collassa nel toggler: niente loghi nella barra */
    .cima-nav__logo {
        display: none;
    }
}

/* =====================================================================
   INTEGRAZIONE NELLA PIATTAFORMA (aggiunte al mockup 2)
   Pagine interne, componenti Bootstrap usati da vetrina/scheda/area clienti.
   ===================================================================== */

/* Titoli nel contenuto: il mockup rende bianchi tutti gli h1 (pensati per l'hero) */
.cima-main h1 {
    color: var(--cima-heading);
}
.cima-main .cima-hero__title,
.cima-main .cima-page-header h1 {
    color: #fff;
}

/* I bottoni Bootstrap tengono i loro colori anche se sono link
   (la regola ".cima-body a" del mockup li renderebbe rossi) */
.cima-body a.btn {
    color: var(--bs-btn-color);
}
.cima-body a.btn:hover {
    color: var(--bs-btn-hover-color);
}

/* Pulsanti rossi usati come link: testo bianco (il pulsante bianco dell'hero
   resta con il testo rosso, come nel mockup) */
.cima-body a.cima-btn:not(.cima-btn--light),
.cima-body a.cima-btn:not(.cima-btn--light):hover {
    color: #fff;
}

/* Colore primario di Bootstrap = rosso CIMA */
.cima-body {
    --bs-primary: #e3001b;
    --bs-primary-rgb: 227, 0, 27;
    --bs-link-color: #e3001b;
    --bs-link-color-rgb: 227, 0, 27;
    --bs-link-hover-color: #b30015;
    --bs-link-hover-color-rgb: 179, 0, 21;
}
.cima-body .btn-primary {
    --bs-btn-bg: var(--cima-red);
    --bs-btn-border-color: var(--cima-red);
    --bs-btn-hover-bg: var(--cima-red-dark);
    --bs-btn-hover-border-color: var(--cima-red-dark);
    --bs-btn-active-bg: var(--cima-red-dark);
    --bs-btn-active-border-color: var(--cima-red-dark);
    --bs-btn-disabled-bg: var(--cima-red);
    --bs-btn-disabled-border-color: var(--cima-red);
}
.cima-body .btn-outline-primary {
    --bs-btn-color: var(--cima-red);
    --bs-btn-border-color: var(--cima-red);
    --bs-btn-hover-bg: var(--cima-red);
    --bs-btn-hover-border-color: var(--cima-red);
    --bs-btn-active-bg: var(--cima-red-dark);
    --bs-btn-active-border-color: var(--cima-red-dark);
}
.cima-body .pagination {
    --bs-pagination-color: var(--cima-red);
    --bs-pagination-hover-color: var(--cima-red-dark);
    --bs-pagination-active-bg: var(--cima-red);
    --bs-pagination-active-border-color: var(--cima-red);
    --bs-pagination-focus-box-shadow: 0 0 0 .25rem rgba(227, 0, 27, .25);
}
.cima-body .form-control:focus,
.cima-body .form-select:focus,
.cima-body .form-check-input:focus {
    border-color: #f07c89;
    box-shadow: 0 0 0 .25rem rgba(227, 0, 27, .2);
}
.cima-body .form-check-input:checked {
    background-color: var(--cima-red);
    border-color: var(--cima-red);
}

/* Contenuto principale */
.cima-main {
    min-height: 50vh;
}
.cima-main > .container {
    padding-top: 2.5rem;
    padding-bottom: 3rem;
}

/* Testata delle pagine interne: stessa foto dell'hero, più bassa */
.cima-page-header {
    position: relative;
    background-size: cover;
    background-position: center;
    padding: 4.5rem 0 3.5rem;
}
.cima-page-header::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,
        rgba(27, 27, 27, .88) 0%,
        rgba(27, 27, 27, .65) 55%,
        rgba(27, 27, 27, .35) 100%);
}
.cima-page-header .container {
    position: relative;
    z-index: 1;
}
.cima-page-header h1 {
    font-size: 2.6rem;
    font-weight: 700;
    margin: 0;
    text-shadow:
        1px 1px 0 #c9000f,
        2px 2px 0 #b30015,
        3px 3px 0 #9a0012,
        4px 4px 8px rgba(0, 0, 0, .5);
}
.cima-page-header p {
    color: rgba(255, 255, 255, .9);
    font-size: 1.15rem;
    margin: .75rem 0 0;
    max-width: 44rem;
}

/* Testo lungo delle pagine interne */
.cima-prose {
    font-size: 1.08rem;
}
.cima-prose p {
    margin-bottom: 1.1rem;
}
.cima-prose .lead {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--cima-heading);
}

/* Riquadro metallizzato riutilizzabile (box laterali, certificato) */
.cima-panel {
    background: linear-gradient(150deg, #ffffff 0%, #eef1f4 40%, #dde2e7 70%, #cfd5db 100%);
    border: 1px solid #c9cfd6;
    border-radius: 6px;
    padding: 1.75rem;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .9),
        inset 0 -2px 3px rgba(0, 0, 0, .06),
        0 .3rem .7rem rgba(0, 0, 0, .06);
}
.cima-panel h3 {
    font-size: 1.2rem;
    margin-bottom: 1rem;
}

/* Elenco con punto rosso */
.cima-list {
    list-style: none;
    padding: 0;
    margin: 0 0 1rem;
}
.cima-list li {
    position: relative;
    padding-left: 1.4rem;
    margin-bottom: .55rem;
}
.cima-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .62em;
    width: .55rem;
    height: .55rem;
    border-radius: 50%;
    background: var(--cima-red);
}

/* Certificato */
.cima-certificato {
    display: block;
    max-width: 100%;
    height: auto;
    border: 1px solid var(--cima-border);
    border-radius: 6px;
    box-shadow: 0 .6rem 1.4rem rgba(0, 0, 0, .15);
}

/* Galleria catalogo ricambi */
.cima-gallery__item {
    display: block;
    background: #fff;
    border: 1px solid #c9cfd6;
    border-radius: 6px;
    overflow: hidden;
    height: 100%;
    transition: box-shadow .2s ease-in-out, transform .2s ease-in-out;
}
.cima-gallery__item:hover {
    box-shadow: 0 .8rem 1.6rem rgba(0, 0, 0, .14);
    transform: translateY(-4px);
}
.cima-gallery__item img {
    width: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
    object-position: top center;
    display: block;
}
.cima-body .cima-gallery__caption {
    display: block;
    padding: .65rem .85rem;
    font-weight: 600;
    font-size: .95rem;
    color: var(--cima-heading);
    border-top: 3px solid var(--cima-red);
}

/* Messaggi flash */
.cima-flash {
    padding-top: 1.25rem;
}

/* Area clienti: barra con logo e menu */
.cima-adminbar {
    background: var(--cima-white);
    border-bottom: 1px solid var(--cima-border);
    padding: .75rem 0;
}
.cima-adminbar .cima-logo {
    max-height: 64px;
}

@media (max-width: 991.98px) {
    .cima-page-header {
        padding: 3rem 0 2.5rem;
    }
    .cima-page-header h1 {
        font-size: 1.8rem;
    }
}