/**
 * Theme Name: Blocksy Child
 * Description: Blocksy Child theme
 * Author: Creative Themes
 * Template: blocksy
 * Text Domain: blocksy
 */

.container-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, 285px);
	gap: 22px;
	justify-content: center;
}

.container-cards-mini-impianto {
    display: grid;
    grid-template-columns: repeat(auto-fill, 280px);
    gap: 22px;
}

.card-macchina {
    position: relative;
    display: block;
    color: inherit;
    text-decoration: none;
    aspect-ratio: 280 / 437;
    transition: transform 300ms ease-out;
}

.card-body {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 20px;
    background: #F4F4F4;
    -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 285 437' preserveAspectRatio='none'><path d='M285 327.768C285 333.423 285 336.25 284.992 336.501C284.581 349.642 282.642 351.581 269.501 351.992C269.25 352 263.167 352 251 352C222.833 352 200 374.833 200 403C200 415.167 200 421.25 199.992 421.501C199.581 434.642 197.642 436.581 184.501 436.992C184.25 437 181.423 437 175.768 437H25.6C16.6392 437 12.1587 437 8.73615 435.256C5.72556 433.722 3.27787 431.274 1.7439 428.264C0 424.841 0 420.361 0 411.4V25.6C0 16.6392 0 12.1587 1.7439 8.73615C3.27787 5.72556 5.72556 3.27787 8.73615 1.7439C12.1587 0 16.6392 0 25.6 0H259.4C268.361 0 272.841 0 276.264 1.7439C279.274 3.27787 281.722 5.72556 283.256 8.73615C285 12.1587 285 16.6392 285 25.6V327.768Z' fill='black'/></svg>");
        mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 285 437' preserveAspectRatio='none'><path d='M285 327.768C285 333.423 285 336.25 284.992 336.501C284.581 349.642 282.642 351.581 269.501 351.992C269.25 352 263.167 352 251 352C222.833 352 200 374.833 200 403C200 415.167 200 421.25 199.992 421.501C199.581 434.642 197.642 436.581 184.501 436.992C184.25 437 181.423 437 175.768 437H25.6C16.6392 437 12.1587 437 8.73615 435.256C5.72556 433.722 3.27787 431.274 1.7439 428.264C0 424.841 0 420.361 0 411.4V25.6C0 16.6392 0 12.1587 1.7439 8.73615C3.27787 5.72556 5.72556 3.27787 8.73615 1.7439C12.1587 0 16.6392 0 25.6 0H259.4C268.361 0 272.841 0 276.264 1.7439C279.274 3.27787 281.722 5.72556 283.256 8.73615C285 12.1587 285 16.6392 285 25.6V327.768Z' fill='black'/></svg>");
    -webkit-mask-size: 100% 100%;
        mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;
    transition: background 300ms ease-out;
}

.card-body.card-body-industriale {
	justify-content: normal;
}

.card-body-industriale .card-image {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-macchina:has(.card-arrow:hover) .card-body {
    background: linear-gradient(155deg, #FF1D5D -2.25%, #FFB70F 100%);
}

.card-title {
    color: #CD2C56;
    font-size: 20px;
    font-weight: 900;
    margin: 0;
    line-height: 100%;
    text-transform: uppercase;
    transition: color 300ms ease-out;
}

.card-image img {
    width: 100%;
    max-height: 270px;
    object-fit: contain;
}

.card-models {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 16px;
    line-height: 100%;
    font-weight: 300;
    color: #1F1F1F;
    transition: color 300ms ease-out;
}

.card-models li {
    padding: 0;
}

.card-arrow {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: linear-gradient(142deg, #FF1D5D 3.87%, #FFB70F 109.5%);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 70px 60px 30px 0 rgba(5, 5, 5, 0.00), 57px 38px 28px 0 rgba(5, 5, 5, 0.01), 32px 21px 23px 0 rgba(5, 5, 5, 0.03), 5px 2px 15.6px 0 rgba(5, 5, 5, 0.15), 4px 2px 5px 0 rgba(5, 5, 5, 0.06);
    z-index: 2;
    transition: background 400ms cubic-bezier(0.4, 0, 0.2, 1),
        transform 400ms cubic-bezier(0.4, 0, 0.2, 1);
}

.card-arrow svg {
    transition: transform 300ms ease-out;
}

.card-arrow svg path {
    transition: fill 300ms ease-out;
}

.card-arrow:hover {
    background: #EE0043;
    transform: scale(1.1);
}

.card-arrow:hover svg {
    transform: rotate(45deg);
}

.card-arrow:hover svg path {
    fill: #fff;
}

.card-macchina:has(.card-arrow:hover) .card-title,
.card-macchina:has(.card-arrow:hover) .card-models {
    color: #FFFFFF !important;
}

.card-arrow:active {
    background: #BE0036;
    transform: scale(0.92);
}

/* === Variante container industriale === */

.container-cards.is-industriale .card-title,
.container-linea.is-industriale .card-title {
    color: #006A9F !important;
}

.container-cards.is-industriale .card-arrow,
.container-linea.is-industriale .card-arrow {
    background: linear-gradient(101deg, #006A9F 17.87%, #04B6F7 85.77%);
}

.container-cards.is-industriale .card-arrow:hover,
.container-linea.is-industriale .card-arrow:hover {
    background: #006A9F;
}

.container-cards.is-industriale .card-arrow:active,
.container-linea.is-industriale .card-arrow:active {
    background: #00557F;
}

.container-cards.is-industriale .card-macchina:has(.card-arrow:hover) .card-body,
.container-linea.is-industriale .card-macchina:has(.card-arrow:hover) .card-body {
    background: linear-gradient(101deg, #006A9F 17.87%, #04B6F7 85.77%);
}

/* === Variante card singola industriale (mix artigianale/industriale) === */

.card-macchina.is-industriale .card-title {
    color: #006A9F !important;
}

.card-macchina.is-industriale .card-arrow {
    background: linear-gradient(101deg, #006A9F 17.87%, #04B6F7 85.77%);
}

.card-macchina.is-industriale .card-arrow:hover {
    background: #006A9F;
}

.card-macchina.is-industriale .card-arrow:active {
    background: #00557F;
}

.card-macchina.is-industriale:has(.card-arrow:hover) .card-body {
    background: linear-gradient(101deg, #006A9F 17.87%, #04B6F7 85.77%);
}